কীভাবে কোনও ঝাঁকুনি উইজেটের (সেন্টার উইজেট) শিশু বৈশিষ্ট্যের মধ্যে শর্তাধীন বিবৃতিটি ব্যবহার করতে হয়

Question 1

এখনও অবধি যখনই আমার উইজেটের মধ্যে শর্তাধীন বিবৃতিটি ব্যবহার করার প্রয়োজন হয়েছিল আমি নিম্নলিখিতটি করেছি (সেন্টার এবং পাত্রে সাধারণ ডামি উদাহরণ হিসাবে ব্যবহার করে):

new Center(
  child: condition == true ? new Container() : new Container()
)

যদিও আমি যখন একটি / অন্য বিবৃতিটি ব্যবহার করার চেষ্টা করেছি তখন এটি একটি ডেড কোড সতর্কতার দিকে পরিচালিত করবে:

new Center(
  child: 
    if(condition == true){
      new Container();
    }else{
      new Container();
    }
)

আকর্ষণীয়ভাবে যথেষ্ট আমি সুইচ কেস স্টেটমেন্ট দিয়ে চেষ্টা করেছি এবং এটি আমাকে একই সতর্কতা দেয় এবং এইভাবে আমি কোডটি চালাতে পারি না। আমি কি কিছু ভুল করছি বা এটি এমন কি যাতে কোনও / অন্যথায় বা ডেড কোড আছে না ভেবে বিড়বিড় করে বক্তব্যগুলি স্যুইচ করতে পারে না?

Question 2

আসলে আপনি করতে পারেন ব্যবহার if/elseএবং switchএবং ডার্ট / ঝাপটানি অন্য কোন বিবৃতি ইনলাইন।

তাত্ক্ষণিক বেনামে ফাংশন ব্যবহার করুন

class StatmentExample extends StatelessWidget {
  Widget build(BuildContext context) {
    return Text((() {
      if(true){
        return "tis true";}

      return "anything but true";
    })());
  }
}

অর্থাত্ কোনও ফাংশনে আপনার বক্তব্য মোড়ানো

(() {
  // your code here
}())

আমি আপনার ইউআই 'মার্কআপ' এর সাথে সরাসরি খুব বেশি যুক্তি যুক্ত করার বিরুদ্ধে সুপারিশ করব তবে আমি দেখতে পেয়েছি যে ডার্টে টাইপের অনুক্রমের জন্য কিছুটা কাজ করা দরকার যাতে এটি কখনও কখনও এর মতো পরিস্থিতিতে কার্যকর হতে পারে।

টার্নারি অপারেটর ব্যবহার করুন

condition ? Text("True") : null,

সংগ্রহগুলিতে বিবৃতি বা স্প্রেড অপারেটরের জন্য বা ব্যবহার করুন

children: [
  ...manyItems,
  oneItem,
  if(canIKickIt)
    ...kickTheCan
  for (item in items)
    Text(item)

একটি পদ্ধতি ব্যবহার করুন

child: getWidget()

Widget getWidget() {
  if (x > 5) ...
  //more logic here and return a Widget

পুনরায় সংজ্ঞায়িত স্যুইচ স্টেটমেন্ট

টার্নারি অপারেটরের অন্য বিকল্প হিসাবে আপনি নীচের পোস্টে https://stackoverflow.com/a/57390589/1058292 এর মতো স্যুইচ স্টেটমেন্টের একটি ফাংশন সংস্করণ তৈরি করতে পারেন ।

  child: case2(myInput,
  {
    1: Text("Its one"),
    2: Text("Its two"),
  }, Text("Default"));

Question 3

ডার্টে if/elseএবং switchবিবৃতিগুলি প্রকাশের নয়। তারা কোনও মান ফেরত দেয় না যাতে আপনি তাদের নির্মাণকারীর প্যারামে পাস করতে পারবেন না। আপনার বিল্ড পদ্ধতিতে আপনার যদি শর্তাধীন যুক্তি থাকে তবে এটিকে চেষ্টা করে সহজ করার জন্য এটি একটি ভাল অনুশীলন। উদাহরণস্বরূপ, আপনি পদ্ধতিগুলিতে স্বাবলম্বিত যুক্তি সরাতে পারেন এবং ব্যবহার করতে পারেনif/else স্থানীয় ভেরিয়েবলগুলি আরম্ভ স্টেটমেন্টগুলি করতে পারেন যা আপনি পরে ব্যবহার করতে পারেন।

একটি পদ্ধতি এবং যদি / অন্যটি ব্যবহার করা হয়

Widget _buildChild() {
  if (condition) {
    return ...
  }
  return ...
}

Widget build(BuildContext context) {
  return new Container(child: _buildChild());
}

ব্যবহার করে একটি `if/else`

Widget build(BuildContext context) {
  Widget child;
  if (condition) {
    child = ...
  } else {
    child = ...
  }
  return new Container(child: child);
}

Question 4

রেকর্ডের জন্য, ডার্ট ২.৩ সংগ্রহের আক্ষরিক ক্ষেত্রে / অন্য বিবৃতি ব্যবহারের সক্ষমতা যুক্ত করেছে। এটি এখন নিম্নলিখিত পদ্ধতিতে সম্পন্ন হয়েছে:

return Column(children: <Widget>[
  Text("hello"),
  if (condition)
     Text("should not render if false"),
  Text("world")
],);

ফ্লুর ইস্যু # 28181 - তালিকায় ইনলাইন শর্তযুক্ত রেন্ডারিং

Question 5

অন্যান্য উত্তরগুলি এর উল্লেখ করে না, আপনি এটিও করতে পারেন:

বিল্ডার উইজেট ব্যবহার করুন

নির্মাতা উইজেট যখন একটি শিশু উইজেট প্রয়োজন বোধ করা হয় একটি অবসান ব্যবহার অনুমোদন করার জন্য বোঝানো হয়:

একটি প্লাটোনিক উইজেট যা তার শিশু উইজেট পাওয়ার জন্য একটি ক্লোজারকে কল করে।

আপনার উইজেট তৈরি করার জন্য যুক্তি লাগানোর সময় এটি সুবিধাজনক , এটি একটি ডেডিকেটেড ফাংশন তৈরির প্রয়োজনীয়তা এড়ায়। তাত্ক্ষণিক বেনাম ফাংশন ব্যবহারের তুলনায় এটি কী পরিষ্কার হয়ে যাচ্ছে তা আমি সন্ধান করি।

আপনি সন্তানের হিসাবে বিল্ডার উইজেটটি ব্যবহার করেন এবং এর builderপদ্ধতিতে আপনার যুক্তি সরবরাহ করেন । আপনার উদাহরণ সহ এটি যায়:

Center(
  child: Builder(
    builder: (context) {
      if (condition) {
        return Container();
      } else {
        return Center();
      }
    }
  )
)

এই ধরনের তুচ্ছ উদাহরণে টের্নারি অপারেটর যথেষ্ট হবে ( child: condition ? Container() : Center()), তবে যদি আরও যুক্তি প্রয়োজন হয় তবে বিল্ডার এটি ধরে রাখার জন্য একটি সুবিধাজনক জায়গা সরবরাহ করে।

এছাড়াও আমি অন্যান্য পোস্টারগুলির সাথেও একমত যে যুক্তিটি ইউআই কোড থেকে বের করা উচিত, তবে যখন এটি কেবলমাত্র একটি switchবা if/ elseবিবৃতি তৈরির জন্য উইজেট নির্ধারণ করতে ব্যবহৃত হয়, আমি এটিকে সেখানে রাখা পছন্দ করি (শর্তটি সহজ হলে শর্তটি সহজ, উদাহরণস্বরূপ একটি পরীক্ষা করা একটি ভিউমোডেলে মান)। বিল্ডার উইজেট এতে সহায়তা করতে পারে।

Question 6

আমি জানতে পেরেছি যে ফ্লাটার ইউআই তৈরির জন্য শর্তযুক্ত যুক্তি ব্যবহারের সহজ উপায় হ'ল যুক্তিটি ইউআইয়ের বাইরে রাখা। দুটি ভিন্ন রঙ ফেরত দেওয়ার জন্য এখানে একটি ফাংশন রয়েছে:

Color getColor(int selector) {
  if (selector % 2 == 0) {
    return Colors.blue;
  } else {
    return Colors.blueGrey;
  }
}

সার্কেল অবতারের ব্যাকগ্রাউন্ড সেট করতে ফাংশনটি নীচে ব্যবহার করা হয়।

new ListView.builder(
  itemCount: users.length,
  itemBuilder: (BuildContext context, int index) {
    return new Column(
      children: <Widget>[
        new ListTile(
          leading: new CircleAvatar(
            backgroundColor: getColor(index),
            child: new Text(users[index].name[0])
          ),
          title: new Text(users[index].login),
          subtitle: new Text(users[index].name),
        ),
        new Divider(height: 2.0),
      ],
    );
  },
);

আপনি বেশ কয়েকটি উইজেটে আপনার রঙ নির্বাচনকারী ফাংশনটিকে পুনরায় ব্যবহার করতে পারবেন বলে খুব ঝরঝরে।

Question 7

আপনি কেবল শর্তযুক্ত বিবৃতি ব্যবহার করতে পারেন a==b?c:d

উদাহরণ স্বরূপ :

Container(
  color: Colors.white,
  child: ('condition')
  ? Widget1(...)
  : Widget2(...)
)

আমি আশা করি আপনি ধারণা পেয়েছেন।

মনে করুন অন্য কোনও শর্ত না থাকলে আপনি সাইজডবক্স.শ্রিংক () ব্যবহার করতে পারেন

Container(
      color: Colors.white,
      child: ('condition')
       ? Widget1(...)
       : SizedBox.shrink()
    )

এটি কলাম হলে ?:অপারেটর লেখার দরকার নেই

Column(
 children: <Widget>[
  if('condition')
    Widget1(...),
 ],
)

Question 8

আমি বা ব্যক্তিগতভাবে এই জাতীয় ব্লক স্টেটমেন্ট সহ শিশুদের মধ্যে বিবৃতি ব্যবহার করি। এটি কেবল উপরের ২.৩.০ ডার্ট সংস্করণে সমর্থন করে।

অন্যথায় যদি

Column(
    children: [
        if (_selectedIndex == 0) ...[
          DayScreen(),
        ] else ...[
          StatsScreen(),
        ],
    ],
 ),

যদি / অন্যথায় যদি

Column(
    children: [
        if (_selectedIndex == 0) ...[
          DayScreen(),
        ] else if(_selectedIndex == 1)...[
          StatsScreen(),
        ],
    ],
 ),

Question 9

সমাধান এখানে। আমি এটি স্থির করেছি। কোডটি এখানে

child: _status(data[index]["status"]),

Widget _status(status) {
  if (status == "3") {
    return Text('Process');
  } else if(status == "1") {
    return Text('Order');
  } else {
    return Text("Waiting");
  }
}

Question 10

আপনি যদি উইজেটের তালিকা ব্যবহার করেন তবে আপনি এটি ব্যবহার করতে পারেন:

class HomePage extends StatelessWidget {
  bool notNull(Object o) => o != null;
  @override
  Widget build(BuildContext context) {
    var condition = true;
    return Scaffold(
      appBar: AppBar(
        title: Text("Provider Demo"),
      ),
      body: Center(
          child: Column(
        children: <Widget>[
          condition? Text("True"): null,
          Container(
            height: 300,
            width: MediaQuery.of(context).size.width,
            child: Text("Test")
          )
        ].where(notNull).toList(),
      )),
    );
  }
}

Question 11

অন্য বিকল্প: ' switch's' এর মতো বিবৃতিতে অনেক শর্ত সহ আমি মানচিত্র ব্যবহার করতে চাই:

return Card(
        elevation: 0,
        margin: EdgeInsets.all(1),
        child: conditions(widget.coupon)[widget.coupon.status] ??
            (throw ArgumentError('invalid status')));


conditions(Coupon coupon) => {
      Status.added_new: CheckableCouponTile(coupon.code),
      Status.redeemed: SimpleCouponTile(coupon.code),
      Status.invalid: SimpleCouponTile(coupon.code),
      Status.valid_not_redeemed: SimpleCouponTile(coupon.code),
    };

শর্তাধীন বিবৃতি স্পর্শ না করে শর্ত তালিকায় উপাদান যুক্ত করা / অপসারণ করা আরও সহজ।

আরেকটি উদাহরণ:

var condts = {
  0: Container(),
  1: Center(),
  2: Row(),
  3: Column(),
  4: Stack(),
};

class WidgetByCondition extends StatelessWidget {
  final int index;
  WidgetByCondition(this.index);
  @override
  Widget build(BuildContext context) {
    return condts[index];
  }
}

Question 12

শর্তসাপেক্ষে_বিল্ডার ব্যবহার করুন 1.0.2

নীচের লিঙ্কটি দেখুন

এখানে ক্লিক করুন

Question 13

অনুশীলনের উদাহরণ:

একটি বোতাম দিয়ে

bool _paused = false;

CupertinoButton(
  child: _paused ? Text('Play') : Text('Pause'),
  color: Colors.blue,
  onPressed: () {
    setState(() {
      _paused = !_paused;
    });
  },
),

Question 14

**** আপনি এই পদ্ধতিটি ব্যবহার করেও শর্তাদি ব্যবহার করতে পারেন ** **

 int _moneyCounter = 0;
  void _rainMoney(){
    setState(() {
      _moneyCounter +=  100;
    });
  }

new Expanded(
          child: new Center(
            child: new Text('\$$_moneyCounter', 

            style:new TextStyle(
              color: _moneyCounter > 1000 ? Colors.blue : Colors.amberAccent,
              fontSize: 47,
              fontWeight: FontWeight.w800
            )

            ),
          ) 
        ),

Question 15

এটি দুর্দান্ত নিবন্ধ এবং কথোপকথন। বর্ণিত হিসাবে আমি টার্নারি অপারেটরটি ব্যবহার করার চেষ্টা করেছি। কোড উল্লিখিত হিসাবে একটি ত্রুটির ফলে কাজ করে না।

Column(children: [ condition? Text("True"): null,],);

উপরের ত্রৈমাসিক উদাহরণটি মিস মিস্ is ডার্টটি একটি ত্রুটির সাথে প্রতিক্রিয়া জানাবে যে উইজেটের পরিবর্তে একটি নাল ফেরানো হয়েছিল। আপনি শূন্য ফিরে আসতে পারবেন না। সঠিক উপায়টি হ'ল কোনও উইজেট ফিরিয়ে দেওয়া:

Column(children: [ condition? Text("True"): Text("false"),],);

টেনারিটি কাজ করার জন্য আপনাকে একটি উইজেট ফেরত দিতে হবে need আপনি যদি কিছু ফিরিয়ে দিতে না চান তবে খালি পাত্রে ফিরে আসতে পারেন।

Column(children: [ condition? Text("True"): Container(),],);

শুভকামনা।

Question 16

বিড়বিড় করে যদি আপনি শর্তাধীন রেন্ডারিং করতে চান তবে আপনি এটি করতে পারেন:

Column(
   children: <Widget>[
     if (isCondition == true)
        Text('The condition is true'),
   ],
 );

তবে আপনি যদি কোনও তৃতীয় (যদি-অন্য) শর্তটি ব্যবহার করতে চান তবে কী হবে? যখন শিশু উইজেটটি বহু-স্তরযুক্ত হয়।

আপনি এটির সমাধানের জন্য এটি ব্যবহার করতে পারেন flutter_conditional_ একটি ফ্লাটার প্যাকেজ রেন্ডারিং যা শর্তসাপেক্ষে রেন্ডারিং বাড়ায়, যদি-অন্যথায় সমর্থন করে এবং শর্ত পরিবর্তন করতে পারে।

যদি-অন্য শর্ত:

Column(
      children: <Widget>[
        Conditional.single(
          context: context,
          conditionBuilder: (BuildContext context) => someCondition == true,
          widgetBuilder: (BuildContext context) => Text('The condition is true!'),
          fallbackBuilder: (BuildContext context) => Text('The condition is false!'),
        ),
      ],
    );

স্যুইচ শর্ত:

Column(
      children: <Widget>[
        ConditionalSwitch.single<String>(
          context: context,
          valueBuilder: (BuildContext context) => 'A',
          caseBuilders: {
            'A': (BuildContext context) => Text('The value is A!'),
            'B': (BuildContext context) => Text('The value is B!'),
          },
          fallbackBuilder: (BuildContext context) => Text('None of the cases matched!'),
        ),
      ],
    );

আপনি যদি শর্তাধীনভাবে এককটির (List<Widget>)পরিবর্তে উইজেটগুলির একটি তালিকা রেন্ডার করতে চান । ব্যবহার করুন Conditional.list()এবংConditionalSwitch.list()!

Question 17

কয়েক মাস ব্যবহারের পরেও লোল?: আমি কেবল এটি ব্যবহার করতে পারি তা জানতে পেরেছি:

Column(
     children: [
       if (true) Text('true') else Text('false'),
     ],
   )

Question 18

আপনি ডার্টে শর্তাধীন বিবৃতিগুলির জন্য টার্নারি অপারেটর ব্যবহার করতে পারেন, এটি ব্যবহার সহজ is

(condition) ? statement1 : statement2

যদি conditionসত্য হয় তবে statement1অন্যথায় কার্যকর করা হবে statement2।

একটি ব্যবহারিক উদাহরণ গ্রহণ করা

Center(child: condition ? Widget1() : Widget2())

মনে রাখবেন যে আপনি ব্যবহার করতে যাচ্ছেন এটি ব্যবহার nullকরা Widget2আরও ভাল SizedBox.shrink()কারণ কিছু অভিভাবক উইজেট একটি nullশিশু পাওয়ার পরে একটি ব্যতিক্রম ছুঁড়ে দেবে ।

Question 19

আমার অ্যাপে আমি একটি WidgetChooserউইজেট তৈরি করেছি যাতে আমি শর্তযুক্ত যুক্তি ছাড়াই উইজেটগুলির মধ্যে চয়ন করতে পারি:

WidgetChooser(
      condition: true,
      trueChild: Text('This widget appears if the condition is true.'),
      falseChild: Text('This widget appears if the condition is false.'),
    );

এটি WidgetChooserউইজেটের উত্স :

import 'package:flutter/widgets.dart';

class WidgetChooser extends StatelessWidget {
  final bool condition;
  final Widget trueChild;
  final Widget falseChild;

  WidgetChooser({@required this.condition, @required this.trueChild, @required this.falseChild});

  @override
  Widget build(BuildContext context) {
    if (condition) {
      return trueChild;
    } else {
      return falseChild;
    }
  }
}

Question 20

কেবল স্পন্দিত উইজেট হলে

if(bool = true) Container(

child: ....

),

OR

if(bool = true) Container(

child: ....

) else new Container(child: lalala),