Backup
This commit is contained in:
parent
d7e3a95f9b
commit
da0d560301
24
examples/shadow_simple.php
Normal file
24
examples/shadow_simple.php
Normal file
@ -0,0 +1,24 @@
|
||||
<?php
|
||||
|
||||
require_once __DIR__ . '/../vendor/autoload.php';
|
||||
|
||||
use PHPNative\Framework\Application;
|
||||
use PHPNative\Ui\Widget\Container;
|
||||
use PHPNative\Ui\Window;
|
||||
|
||||
// Create application
|
||||
$app = new Application();
|
||||
$window = new Window('Simple Shadow Test', 400, 400);
|
||||
|
||||
// Main container with light background
|
||||
$mainContainer = new Container('flex items-center justify-center bg-gray-200');
|
||||
|
||||
// Simple box with shadow
|
||||
$box = new Container('w-48 h-48 bg-white rounded-lg shadow-lg');
|
||||
|
||||
$mainContainer->addComponent($box);
|
||||
|
||||
// Set window content and run
|
||||
$window->setRoot($mainContainer);
|
||||
$app->addWindow($window);
|
||||
$app->run();
|
||||
@ -403,14 +403,6 @@ abstract class Component
|
||||
|
||||
Profiler::increment('render_normal');
|
||||
|
||||
// Render shadow if present (before background)
|
||||
if (
|
||||
isset($this->computedStyles[\PHPNative\Tailwind\Style\Shadow::class]) &&
|
||||
($shadow = $this->computedStyles[\PHPNative\Tailwind\Style\Shadow::class])
|
||||
) {
|
||||
$this->renderShadow($renderer, $shadow);
|
||||
}
|
||||
|
||||
// Render normally if no cache or cache building
|
||||
if (
|
||||
isset($this->computedStyles[\PHPNative\Tailwind\Style\Background::class]) &&
|
||||
@ -857,15 +849,16 @@ abstract class Component
|
||||
}
|
||||
|
||||
// Define shadow properties based on size
|
||||
// Using fewer layers with proper alpha distribution
|
||||
$shadowProps = match ($shadow->size) {
|
||||
'sm' => ['blur' => 1, 'offsetX' => 0, 'offsetY' => 1, 'alpha' => 15],
|
||||
'base' => ['blur' => 2, 'offsetX' => 0, 'offsetY' => 2, 'alpha' => 25],
|
||||
'md' => ['blur' => 3, 'offsetX' => 0, 'offsetY' => 4, 'alpha' => 30],
|
||||
'lg' => ['blur' => 4, 'offsetX' => 0, 'offsetY' => 6, 'alpha' => 35],
|
||||
'xl' => ['blur' => 5, 'offsetX' => 0, 'offsetY' => 10, 'alpha' => 40],
|
||||
'2xl' => ['blur' => 7, 'offsetX' => 0, 'offsetY' => 15, 'alpha' => 50],
|
||||
'inner' => ['blur' => 2, 'offsetX' => 0, 'offsetY' => 0, 'alpha' => 20, 'inner' => true],
|
||||
default => ['blur' => 2, 'offsetX' => 0, 'offsetY' => 2, 'alpha' => 25],
|
||||
'sm' => ['blur' => 3, 'spread' => 1, 'offsetX' => 0, 'offsetY' => 1, 'alpha' => 40],
|
||||
'base' => ['blur' => 4, 'spread' => 2, 'offsetX' => 0, 'offsetY' => 2, 'alpha' => 45],
|
||||
'md' => ['blur' => 6, 'spread' => 3, 'offsetX' => 0, 'offsetY' => 4, 'alpha' => 50],
|
||||
'lg' => ['blur' => 8, 'spread' => 5, 'offsetX' => 0, 'offsetY' => 6, 'alpha' => 55],
|
||||
'xl' => ['blur' => 10, 'spread' => 7, 'offsetX' => 0, 'offsetY' => 10, 'alpha' => 60],
|
||||
'2xl' => ['blur' => 15, 'spread' => 10, 'offsetX' => 0, 'offsetY' => 15, 'alpha' => 70],
|
||||
'inner' => ['blur' => 4, 'spread' => 2, 'offsetX' => 0, 'offsetY' => 0, 'alpha' => 45, 'inner' => true],
|
||||
default => ['blur' => 4, 'spread' => 2, 'offsetX' => 0, 'offsetY' => 2, 'alpha' => 45],
|
||||
};
|
||||
|
||||
// Get shadow color (default to black/gray if not specified)
|
||||
@ -891,51 +884,58 @@ abstract class Component
|
||||
$borderRadius = $border->roundTopLeft ?? 0;
|
||||
}
|
||||
|
||||
// Render shadow layers (simulate blur with multiple semi-transparent layers)
|
||||
for ($i = 0; $i < $shadowProps['blur']; $i++) {
|
||||
$offset = $i;
|
||||
$layerAlpha = (int) ($shadowColor->alpha / $shadowProps['blur']);
|
||||
// Render shadow layers (simulate blur with expanding semi-transparent layers)
|
||||
// Note: Alpha blending is automatic when using alpha values < 255 in sdl_set_render_draw_color
|
||||
// Render from outermost to innermost for proper blending
|
||||
for ($i = $shadowProps['blur'] - 1; $i >= 0; $i--) {
|
||||
// Calculate alpha that decreases towards outer layers (blur effect)
|
||||
// Innermost layer (i=0) has full alpha, outermost has minimal alpha
|
||||
$progress = 1.0 - ($i / $shadowProps['blur']);
|
||||
$layerAlpha = (int) ($shadowProps['alpha'] * $progress);
|
||||
|
||||
// Ensure minimum visibility
|
||||
if ($layerAlpha < 5) {
|
||||
$layerAlpha = 5;
|
||||
}
|
||||
|
||||
// Calculate expansion for blur effect
|
||||
$expansion = $shadowProps['spread'] * ($i / $shadowProps['blur']);
|
||||
|
||||
if (isset($shadowProps['inner']) && $shadowProps['inner']) {
|
||||
// Inner shadow - render inside the element
|
||||
$shadowX = (int) ($this->viewport->x + $offset);
|
||||
$shadowY = (int) ($this->viewport->y + $offset);
|
||||
$shadowWidth = (int) max(0, $this->viewport->width - ($offset * 2));
|
||||
$shadowHeight = (int) max(0, $this->viewport->height - ($offset * 2));
|
||||
// Inner shadow - render inside the element, shrinking inwards
|
||||
$shadowX = (int) ($this->viewport->x + $expansion);
|
||||
$shadowY = (int) ($this->viewport->y + $expansion);
|
||||
$shadowWidth = (int) max(0, $this->viewport->width - ($expansion * 2));
|
||||
$shadowHeight = (int) max(0, $this->viewport->height - ($expansion * 2));
|
||||
} else {
|
||||
// Outer shadow - render behind the element
|
||||
$shadowX = (int) ($this->viewport->x + $shadowProps['offsetX'] + $offset);
|
||||
$shadowY = (int) ($this->viewport->y + $shadowProps['offsetY'] + $offset);
|
||||
$shadowWidth = (int) $this->viewport->width;
|
||||
$shadowHeight = (int) $this->viewport->height;
|
||||
// Outer shadow - expand outwards from element
|
||||
$shadowX = (int) ($this->viewport->x + $shadowProps['offsetX'] - $expansion);
|
||||
$shadowY = (int) ($this->viewport->y + $shadowProps['offsetY'] - $expansion);
|
||||
$shadowWidth = (int) ($this->viewport->width + ($expansion * 2));
|
||||
$shadowHeight = (int) ($this->viewport->height + ($expansion * 2));
|
||||
}
|
||||
|
||||
// Skip if shadow is too small
|
||||
if ($shadowWidth <= 0 || $shadowHeight <= 0) {
|
||||
// Skip if shadow is too small or alpha is too low
|
||||
if ($shadowWidth <= 0 || $shadowHeight <= 0 || $layerAlpha < 1) {
|
||||
continue;
|
||||
}
|
||||
sdl_set_render_draw_color(
|
||||
$renderer,
|
||||
$shadowColor->red,
|
||||
$shadowColor->green,
|
||||
$shadowColor->blue,
|
||||
$layerAlpha,
|
||||
);
|
||||
|
||||
if ($borderRadius > 0 && $border !== null) {
|
||||
// Render rounded shadow
|
||||
// Render rounded shadow with expanding border radius
|
||||
$x2 = $shadowX + $shadowWidth;
|
||||
$y2 = $shadowY + $shadowHeight;
|
||||
$radiusExpansion = $expansion / 2;
|
||||
|
||||
sdl_rounded_box_ex(
|
||||
$renderer,
|
||||
$shadowX,
|
||||
$shadowY,
|
||||
$x2,
|
||||
$y2,
|
||||
$border->roundTopLeft ?? 0,
|
||||
$border->roundTopRight ?? 0,
|
||||
$border->roundBottomRight ?? 0,
|
||||
$border->roundBottomLeft ?? 0,
|
||||
(int) (($border->roundTopLeft ?? 0) + $radiusExpansion),
|
||||
(int) (($border->roundTopRight ?? 0) + $radiusExpansion),
|
||||
(int) (($border->roundBottomRight ?? 0) + $radiusExpansion),
|
||||
(int) (($border->roundBottomLeft ?? 0) + $radiusExpansion),
|
||||
$shadowColor->red,
|
||||
$shadowColor->green,
|
||||
$shadowColor->blue,
|
||||
@ -943,7 +943,13 @@ abstract class Component
|
||||
);
|
||||
} else {
|
||||
// Render rectangular shadow
|
||||
error_log(sprintf('%s,%s,%s,%s', $shadowX, $shadowY, $shadowWidth, $shadowHeight));
|
||||
sdl_set_render_draw_color(
|
||||
$renderer,
|
||||
$shadowColor->red,
|
||||
$shadowColor->green,
|
||||
$shadowColor->blue,
|
||||
$layerAlpha,
|
||||
);
|
||||
sdl_render_fill_rect($renderer, [
|
||||
'x' => $shadowX,
|
||||
'y' => $shadowY,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user