الجوال والشاشات

الشكل الثابت لكل تطبيق — الإطار الذي يرسمه المضيف

كل ما يُفتح على أوكتا — شاشات المنصّة وتطبيقك المصغّر معاً — يجلس في إطار واحد: هيدر داكن بارتفاع 56 في الوضعين، وتحته الصفحة بزاويتين علويتين مدوّرتين على أرضية الهيدر نفسها، وبوتوم بار صلب مثبَّت على الحافة السفلية بارتفاع 72، وأنيميشن فتح واحد «البطاقة تصير الشاشة».

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

ما يرسمه المضيف حولك

والقصّ مشروط بأن يكون لتطبيقك شريط: Scaffold بلا appBar لا وصلة تحته ولا زاويتين. فإن أردت الإطار، ضع شريطاً.

أربعة أسطر، وهي كل نصيبك

١ — OktaAppBar، لا AppBar خاماً بألوانك.

Scaffold(
  appBar: OktaAppBar.build('حضور اليوم', palette),   // أو withActions / buildWithIcon
  body: content,
)

وإن بنيتَ شريطك بنفسك لسببٍ ما، خذ لونيه من الدالّتين ولا تكتب الرقم بيدك:

AppBar(
  backgroundColor: OktaAppBar.barBackground(palette),
  foregroundColor: OktaAppBar.barForeground(palette),
  ...
)

الهيدر داكن في الوضعين ولا ينقلب مع المظهر — وهذا هو الشكل الثابت نفسه. وpalette.textStrong على الهيدر يكاد يكون أسود في الوضع الفاتح، أي حبرٌ لا يُقرأ على شريط داكن؛ فلذلك barForeground موجودة.

٢ — البار السفلي OktaTabs.bottomBar، وهو بار المنصّة الآن.

Scaffold على هذا المشغّل يقبل appBar وbody وfloatingActionButton ولا يقبل bottomNavigationBar — فالبار المثبَّت آخرُ ابنٍ في Column جسمُه Expanded:

final labels = <String>['الرئيسية', 'التقارير'];
final icons = <IconData>[OktaIcons.home(), OktaIcons.chart()];

final rows = <Widget>[];
rows.add(Expanded(flex: 1, child: content));          // جسم الشاشة
rows.add(OktaTabs.bottomBar(labels, icons, _index, _onSelect, palette));

return Scaffold(
  appBar: OktaAppBar.build('حضور اليوم', palette),
  body: Column(children: rows),
);

واكتب flex: 1 صراحةً. المعامل المسمّى المحذوف يصل null على هذا المشغّل ويُصبّ في int، فـExpanded(child: …) وحدها تموت على الجهاز — وهذا بالضبط نوع العطل الذي لا تمسكه قراءةُ الشفرة.

والبار يخرج صلباً على الحافة: ارتفاع 72، خطّ شعري علوي، مؤشّر 28×3 فوق التبويب النشط لا تعبئة خلفه، أيقونة 24 وتسمية 11 — نفس بار المضيف خليّةً بخليّة. وbottomBarWithDots تضيف نقطة «غير مقروء» على أي تبويب علمه true.

٣ — لا ترسم الزاويتين ولا الهيدر بنفسك. BoxDecoration(borderRadius:) يُسقطه الجسر أصلاً، وإطارٌ يرسمه كل تطبيق هو ما وُجد الإطارُ الواحد ليمنعه.

٤ — ولا ترفع minContract. لا رمز جديد هنا، ورفعُه بلا حاجة يرفض أجهزة كان تطبيقك يعمل عليها.

floatingBar باقية، ولم تعد هي هيئة المنصّة

إن كان تطبيقك يستعمل OktaTabs.floatingBar (عقد 18) فهو يعمل كما هو ولن ينكسر — لا شيء حُذف. لكنه لم يعد شكل المنصّة: البار العائم يترك شريطاً من الأرضية ظاهراً تحته على النوافذ العريضة، وهو ما دفع الشكل الموحَّد إلى تثبيت البار على الحافة وجعل الصفحة تمتدّ إليه.

فإن أردت أن يقرأ تطبيقك كبقيّة المنصّة، بدّل النداء إلى bottomBar بالتركيب أعلاه — الوسائط نفسها، ويسقط معها floatingOver وfloatingReserve.

عرض الدليل كاملاً في صفحة واحدة · ↧ Markdown خام