اذهب إلى المحتوى
  • 0

تعريف ثلاث خيارت للمستخدم في فلاتر

Mohammed Abu Yousef

السؤال

Recommended Posts

  • 1

يمكنك أستخدام   Widget RadioListTile بحيث تضع أكثر من خيار و عندما يقوم المستخدم بأختيار أي خيار موجود تأخذ قيمته, ستقوم بتعريف enum تحتوي الخيارات الثلاثة 

enum RadioValues { _, yes, no}

ثم تقوم بتعريف متغير وليكن اسمه _values 

RadioValues  _values = RadioValues.yes;

وتقوم بإعطاءه قيمة افتراضية, ثم تنشأ Column لأحتواء الخيارات الثلاثة مثل 

Column(
      children: [
        RadioListTile<RadioValues>(
            title: Text("_"),
            value: RadioValues._,
            groupValue: _values,
            onChanged: (RadioValues value){
              setState(() {
                _values = value;
              });
            }),

        RadioListTile<RadioValues>(
            title: Text("Yes"),
            value: RadioValues.yes,
            groupValue: _values,
            onChanged: (RadioValues value){
              setState(() {
                _values = value;
              });
            }),

        RadioListTile<RadioValues>(
            title: Text("No"),
            value: RadioValues.no,
            groupValue: _values,
            onChanged: (RadioValues value){
              setState(() {
                _values = value;
              });
            }),
      ],
    );

و في دالة onChanged تقوم بتعريف setState ليقوم عند التغيير إلى خيار يحفظ قيمة الخيار الجديد وتخزينها في متغير values_. 

كامل الكود 

import 'package:flutter/material.dart';

enum RadioValues { _, yes, no}

class RadioTest extends StatefulWidget {
  @override
  _RadioTestState createState() => _RadioTestState();
}

class _RadioTestState extends State<RadioTest> {

  RadioValues  _values = RadioValues.yes;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            RadioListTile<RadioValues>(
                title: Text("_"),
                value: RadioValues._,
                groupValue: _values,
                onChanged: (RadioValues value){
                  setState(() {
                    _values = value;
                  });
                }),

            RadioListTile<RadioValues>(
                title: Text("Yes"),
                value: RadioValues.yes,
                groupValue: _values,
                onChanged: (RadioValues value){
                  setState(() {
                    _values = value;
                  });
                }),

            RadioListTile<RadioValues>(
                title: Text("No"),
                value: RadioValues.no,
                groupValue: _values,
                onChanged: (RadioValues value){
                  setState(() {
                    _values = value;
                  });
                }),
          ],
        ),
      ),
    );
  }
}

 

10.png

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...