تتكون ScrollingFrame من لوحة رسم قابلة للتخصيص و أشرطة تمرير مع تفاعلية تمرير مدمجة وطرق مختلفة لتخصيص كيفية عمل التمرير. تعتبر ScrollingFrame مثالية لعرض الكثير من المعلومات في مساحة محدودة وتعمل بشكل جيد مع تخطيطات القائمة و الشبكة.
لوحة الرسم
تعتبر لوحة الرسم هي المنطقة الرئيسية في ScrollingFrame التي يمكن أن تحتوي على GuiObjects أخرى. يتكيف سلوك التمرير تلقائيًا في السيناريوهات التالية:
| إعداد الإطار | النتيجة |
|---|---|
| ارتفاع CanvasSize للإطار أكبر من ارتفاعه الكلي؛ على وجه التحديد، إجمالي CanvasSize.Y يتجاوز إجمالي Size.Y. | يتم تمكين التمرير العمودي ويظهر شريط تمرير عمودي. |
| عرض CanvasSize للإطار أكبر من عرضه الكلي؛ على وجه التحديد، إجمالي CanvasSize.X يتجاوز إجمالي Size.X. | يتم تمكين التمرير الأفقي ويظهر شريط تمرير أفقي. |
| تم تعيين AutomaticCanvasSize للإطار إلى Y أو XY وإجمالي ارتفاع محتوياته (الأطفال GuiObjects) يتجاوز إجمالي Size.Y. | يتم تمكين التمرير العمودي ويظهر شريط تمرير عمودي. |
| تم تعيين AutomaticCanvasSize للإطار إلى X أو XY وإجمالي عرض محتوياته (الأطفال GuiObjects) يتجاوز إجمالي Size.X. | يتم تمكين التمرير الأفقي ويظهر شريط تمرير أفقي. |
تعكس خاصية CanvasPosition الإزاحة الموضعية الحالية للوحة الرسم داخل الإطار، بالبكسل، وتحدد موضع أشرطة التمرير وفقًا لذلك. لاحظ أن هذه الخاصية لا تفعل شيئًا إذا لم تكن أشرطة التمرير مرئية.
الهوامش
قد تتأثر CanvasSize لإطار التمرير بـ VerticalScrollBarInset و/أو HorizontalScrollBarInset. في الرسم البياني المثال التالي، يستخدم إطار التمرير العمودي عرض لوحة رسم بنسبة 100%. مع تعيين VerticalScrollBarInset إلى None (افتراضي)، تمتد اللوحة إلى العرض الكامل لإطار التمرير، مما يحجب كمية قليلة من المحتوى تحت شريط التمرير. بالمقابل، فإن تعيين VerticalScrollBarInset إلى Always أو ScrollBar يدرج اللوحة بمقدار ScrollBarThickness بحيث تلتقي اللوحة من حافة إلى حافة مع شريط التمرير.
أشرطة التمرير
تعكس أشرطة التمرير في الإطار موضع اللوحة الحالية وتوفر تفاعلية سحب للتمرير تلقائية. بالنسبة لأشرطة التمرير العمودية، تقوم خاصية VerticalScrollBarPosition بتبديل موضع الشريط إلى إما اليسار أو اليمين من اللوحة، ولكن يمكن وضع أشرطة التمرير الأفقية فقط أسفل اللوحة.
يتكون بناء شريط التمرير من ثلاث خصائص أصول:
- TopImage — تظهر في أعلى شريط التمرير العمودي، أو على اليسار من شريط التمرير الأفقي (مُدور 90° عكس اتجاه عقارب الساعة لشريط التمرير الأفقي).
- MidImage — تمتد عبر المنطقة بين TopImage و BottomImage (مُدور 90° عكس اتجاه عقارب الساعة لشريط التمرير الأفقي).
- BottomImage — تظهر في أسفل شريط التمرير العمودي، أو على اليمين من شريط التمرير الأفقي (مُدور 90° عكس اتجاه عقارب الساعة لشريط التمرير الأفقي).
يتغير حجم كل صورة بناءً على خاصية ScrollBarThickness التي تغير عرض شريط التمرير العمودي أو ارتفاع شريط التمرير الأفقي.
يمكن إجراء تعديلات بصرية إضافية من خلال خاصيتي ScrollBarImageColor3 و ScrollBarImageTransparency اللتين تلونان أصول صورة الشريط وتعدلان شفافيتها، على التوالي.
القص
By default, GuiObject containers clip their content (descendant GuiObjects) through the ClipsDescendants boolean. If you want descendants to appear outside of a container's bounds, simply set ClipsDescendants to false.
Importantly, StarterGui.ClipsDescendantsSupportsRotation must be true for clipping to work on rotated descendants (non‑zero Rotation) within the container. However, clipping by a rotated container (clipping container itself is rotated) or by rounded corners (UICorner) is not supported. If you need clipping on rotated or rounded containers, consider CanvasGroup.
Rotation = 0
Rotation = 10
المرونة
بشكل افتراضي، تظهر ScrollingFrames سلوك تمرير مرن على الأجهزة التي تدعم اللمس، مما يعني أن المستخدمين يمكنهم سحب اللوحة قليلاً أبعد من حدودها وعند الإفراج، ستعود اللوحة إلى حدها الأدنى أو الأقصى. إذا كنت ترغب في إزالة السلوك المرن تمامًا وضمان عدم تمرير اللوحة خارج حدودها، قم بتعيين خاصية ElasticBehavior إلى Never.