النماذج
خانة الاختيار
خيار مستقل يمكن تفعيله أو إلغاؤه.
هذه معاينة مرجعية للويب. شيفرة Flutter الأصلية متاحة أدناه ومختبرة ضمن الحزمة.
الشيفرة
استخدم CSS وHTML الأصليين، وأضف JavaScript عند الحاجة إلى تفاعل.
import '@cave-ui/core/tokens.css';
import '@cave-ui/core/styles.css';<label class="cave-control"><input type="checkbox" name="copy">إرسال نسخة بالبريد</label>مثال كامل قابل للتشغيل داخل مشروع Flutter مع حزمة cave_ui.
import 'package:flutter/material.dart';
import 'package:cave_ui/cave_ui.dart';
void main() => runApp(CaveApp(
controller: CaveController(locale: const Locale('ar')),
home: const Scaffold(body: SafeArea(child: Padding(
padding: EdgeInsetsDirectional.all(24), child: CheckboxExample()))),
));
class CheckboxExample extends StatefulWidget {
const CheckboxExample({super.key});
@override
State<CheckboxExample> createState() => _CheckboxExampleState();
}
class _CheckboxExampleState extends State<CheckboxExample> {
bool checked = false;
@override
Widget build(BuildContext context) => CaveCheckbox(label: 'إرسال نسخة بالبريد', value: checked,
onChanged: (value) => setState(() => checked = value ?? false));
}
الإرشادات
استخدم خانة اختيار أصلية مع عنوان قابل للنقر. اجمع الخيارات المترابطة في fieldset مع legend. وضّح سبب عدم إتاحة الخيارات المعطّلة.