Liquid Glass Easy

الزجاج الخفيف

المادة بلا شيدر: صقيع ولون وحافة، ولا شيء يُترجَم.

تأخذ العدسة مظهرها من شيدر أجزاء: كل بكسل يقيس بعده عن الشكل، ويقرأ الخلفية تحته، ويحنيها، ويضيء نفسه. أما الزجاج الخفيف فيتخلى عن الحني — النصف الذي يحتاج شيدراً — ويحتفظ بكل ما عداه: الصقيع واللون وضوءا العدسة، محسوبَين في جهة Dart بمعادلات الشيدر نفسها ومرسومَين كشبكات مثلثات من هندسة اللوحة العادية. لا FragmentProgram، ولا شيء يُسخَّن، ولا التقاط على Skia، ولا مقعد في ميزانية العدسات على Impeller.

ثلاثة مداخل#

مادة واحدة لها ثلاثة أبواب: اقلب التطبيق كله، أو اقلب عدسة واحدة، أو استعمل العنصر مباشرةً على سطح لم يكن عدسة قط.

Dart
// 1. Every lens in the app — set once, before the first lens builds.
LiquidGlassEngine.liteGlassOnSkia = true;      // Skia and the web
LiquidGlassEngine.liteGlassOnImpeller = true;  // Impeller

// 2. This lens only, on either engine.
LiquidGlassLens(
  style: const LiquidGlassStyle(liteGlass: true),
  child: child,
)

// 3. The widget itself, for a card, a row, a sheet.
LiquidGlassLite(
  shape: const LiquidGlassShape(cornerRadius: 22),
  specular: const LiquidGlassLight.specular(thickness: 8, angle: 90),
  glow: const LiquidGlassLight.glow(angle: 0, intensity: 0.8),
  blur: 3,
  color: const Color(0x33FFFFFF),
  child: child,
)

ومع تشغيل مفتاح المحرك لا يلتقط LiquidGlassView أي لقطة زجاج إطلاقاً — فالمعاين التكيفي ليس التقاطاً ويظل يعمل — وترسم كل عدسة تحته زجاجاً خفيفاً، وهو ما ترسمه العدسة خارج أي عارض أصلاً. وهذا هو السبيل لوضع المادة على صفحة فيها من العدسات ما يفوق طاقة الشيدر، أو على جهاز لا وقت لديه له، دون أن تمسّ عدسة واحدة.

ما تحتفظ به العدسة#

تحتفظ العدسة المرسومة خفيفةً بـshape وبـcolor وblur وshadow، وبـmagnification كتكبير مسطّح داخل مرشّح الصقيع نفسه. وتذهب refractionIndex وrefractionWidth وdispersion — فلا حني للحافة. والحافة هي specular وglow الأسلوب بالأرقام نفسها: السماكة والحدّة والزاوية والانتشار والشدّة واللون تعني ما تعنيه على عدسة حقيقية، ويجلس التوهّج تحت البريق كما هناك. والصورة الظلية هي المحيط الذي تُقصّ العدسة عليه، فتُستنسَخ أنماط الزوايا الثلاثة بدقة.

ما يظل يعمل، وما لا يعمل#

يغيّر الزجاج الخفيف كيف تُرسَم العدسة، لا ما تفعله الشجرة حولها. فكل ما لم يحتج الشيدر قط يظل يعمل، والشيئان اللذان هما الشيدر نفسه لا.

ماذاتحت الزجاج الخفيف
كل العناصرتعمل كما هي، بلا انكسار. فالمزلاج والمفتاح والزر وزر الإجراء العائم وشريط التطبيق وشريط التبويبات والحوار والورقة والسقالة والقابل للسحب وحبة الحركة تحتفظ كلها بسلوكها وحركتها وظلها؛ وزجاجها صقيع ولون وحافة. ويصلح pillStyle.mode: both في شريط التبويبات على Skia هنا، إذ لا التقاط يُضاعَف.
touch / LiquidGlassFlexيعمل. فانتفاخ الضغط وتشوّه السحب يحجّمان المحيط الخفيف وابنه تماماً كما يحجّمان محيط الشيدر.
adaptivityتعمل. فالمعاين التكيفي ليس التقاط زجاج ويظل يعمل تحت مفتاح المحرك، فيظل اللون والمحتوى ينقلبان مع الخلفية — على عدسة، وفي منطقة، وعبر رابط، وعلى أشرطة النظام في السقالة.
LiquidGlassScrollEdgeبلا تغيير. فالشريط لم يستعمل الشيدر قط.
shadowمحفوظ. يُرسَم ظل التلامس حول المحيط الخفيف كما يُرسَم حول محيط الشيدر.
LiquidGlassMorphيعمل كـ`plain`. عدسة واحدة ينبض محيطها من الشكل القديم إلى الجديد؛ ويُتجاهَل motion، ولا كتلة ثانية ولا عنق، لأن سطحين خفيفين لا يمكن دمجهما في واحد.
LiquidGlassBlenderلا يدمج. فلا مرور مدمَج: يرسم كل عضو وحده سطحاً خفيفاً خاصاً به، بمحيطه وقراءته. لا كرة معدنية ولا مادة مشتركة.
LiquidGlassBatchمشتركة على Impeller. كل صقيع خفيف مرشّح بذاته، وداخل الدفعة يقرأ نسخة الدفعة كأي عضو. وخاملة على Skia.
الانكسارذاهب، عدا `magnification`. فلا تفعل refractionIndex وrefractionWidth وdispersion شيئاً؛ ويبقى magnification تكبيراً مسطّحاً داخل مرشّح الصقيع.
glowيُرسم، تحت البريق. يُقصّ من القراءة نفسها التي يُقصّ منها البريق، فلا يكلّف شيئاً إضافياً.
LiquidGlassShadersلا شيء يُترجَم. فـensureLoaded() غير مضرّ وغير لازم؛ ولا يأخذ LiquidGlassView أي التقاط زجاج.

من أين تأخذ الحافة لونها#

تعاين حافة الشيدر الخلفية تحت كل بكسل وتلوّن بريقها بها، فتكون الحافة فوق صورة حمراء حيث تعبر الأحمر وزرقاء حيث تعبر الأزرق. ويفعل الزجاج الخفيف الشيء نفسه بطريقة أرخص: تُقصّ الحافة من نسخة مضاءة من الخلفية، فيجري لونها على طولها كما في الشيدر. ويجلس اللون تحتها والابن فوقها، ولا يدخل أيٌّ منهما في القراءة.

ما تكلّفه#

  • الصقيع قراءة خلفية واحدة. يمرّ الضباب والتكبير عبر مرشّح واحد، فإضافة التكبير إلى الضباب لا تضيف قراءة.
  • الحافة قراءة ثانية — قراءتان في المجموع، وهو ما تكلّفه عدسة مضبَّبة، ويتشاركها البريق والتوهّج. ومع blur: 0 وتكبير 1 تذهب قراءة الصقيع ولا تبقى إلا قراءة الحافة.
  • الأضواء التي لا ترسم شيئاً لا تقرأ شيئاً. فمع البريق عند intensity: 0 أو thickness: 0 وبلا توهّج لا حافة يُقرأ لأجلها، ومع انعدام الضباب أيضاً يكون العنصر شكلاً ملوّناً عادياً — وهو ما تمدّ يدك إليه في قائمة طويلة.
const LiquidGlassLite({ super.key, this.shape = const LiquidGlassShape(), this.specular, this.glow, this.borderAlpha = 1.0, this.blur = 3.0, this.magnification = 1.0, this.color, this.shapeScale = const Offset(1.0, 1.0), this.child, })
المعاملالنوعالافتراضيالوصف
keyKey?—
shapeLiquidGlassShapeconst LiquidGlassShape()The outline to draw, read exactly as a lens reads it.
specularLiquidGlassLight?—The rim's highlight; null is LiquidGlassLight.specular(). It is read as a lens reads its specular: thickness, sharpness, angle, spread, intensity and colour.
glowLiquidGlassLight?—The rim's soft side light, drawn under the specular and read as a lens reads its glow: thickness, angle, spread, intensity and colour. null draws none.
borderAlphadouble1.0A global multiplier on the rim's opacity, for fading it in and out. The lens uses the same knob for its own show/hide animation.
blurdouble3.0How much the surface frosts what is behind it, inside its own outline. This is the glass itself rather than its edge: a backdrop blur clipped to the shape, painted under child, the same thing a lens' own blur does. A Gaussian sigma; 3 by default, and 0 is a bare rim over whatever is already there. It costs one backdrop read, the surface's only one, so a screen with many of them wants 0 here.
magnificationdouble1.0How much the surface magnifies what is behind it: the backdrop scaled about the shape's centre, evenly, across the whole surface. This is the flat-slab half of a lens' refraction — the content inside the outline stops lining up with the content outside it. It rides in the blur's own filter, so it is free when blur is on. 1.0 is flat.
colorColor?—The glass's own tint, LiquidGlassStyle.color's counterpart: a flat fill of the shape between the frost and child. The rim is painted over it and blends into it. null, or fully transparent, paints nothing.
shapeScaleOffsetconst Offset(1.0, 1.0)The deformation applied to the outline, matching a lens' shape scale: the shape is built at rest size and stretched, so a squeezed circle becomes an ellipse instead of keeping a fixed corner radius.
childWidget?—The content the rim is drawn over: the rim is painted on top of it. When null the widget expands to its constraints and draws the rim alone.

التعليقات

التعليقات هي مناقشات GitHub — يمكنك الرد من أيٍّ من المكانين.