Автоматически выбирать нативные компоненты / виджеты на основе платформы во флаттере

Question

Как автоматически выбирать компоненты / виджеты на основе платформы во флаттере.

Например, если мы используем раскрывающиеся списки в ios, это должен быть пикир, а в android он должен быть всплывающим и нормальным. выпадающий список в Интернете.

Нативные компоненты придадут дополнительный внешний вид в перспективе UI / UX.

Если мы проверяем платформу для всех виджетов, код становится грязным.

Например:

Выборщик из Купертино

GestureDetector(
            child: Text("Date"),
            onTap: () {
              showModalBottomSheet(
                  context: context,
                  builder: (BuildContext builder) {
                    return Scaffold(
                        appBar: AppBar(
                          title: Text(
                            "CupertinoPicker",
                            textAlign: TextAlign.justify,
                          ),
                          backgroundColor: Colors.teal,
                          actions: <Widget>[
                            IconButton(
                              icon: Icon(Icons.send),
                              onPressed: () {},
                            )
                          ],
                        ),
                        body: Container(
                          child: CupertinoPicker(
                            magnification: 1.5,
                            backgroundColor: Colors.black87,
                            children: <Widget>[
                              Text(
                                "TextWidget",
                                style: TextStyle(
                                    color: Colors.white, fontSize: 20),
                              ),
                              MaterialButton(
                                child: Text(
                                  "Button Widget",
                                  style: TextStyle(color: Colors.white),
                                ),
                                color: Colors.redAccent,
                              ),
                              IconButton(
                                icon: Icon(Icons.home),
                                color: Colors.white,
                                iconSize: 40,
                                onPressed: () {},
                              )
                            ],
                            itemExtent: 50, //height of each item
                            onSelectedItemChanged: (int index) {
                              selectitem = index;
                            },
                          ),
                        ));
                  });
            },
          ),

Здесь я интегрировал сборщик выборок и много строк для его интеграции, а в android родной вид не там. Это хорошо выглядит в ios.

Answer 1

Вы можете написать любой виджет, поддерживающий обе платформы:

class ProgressBar extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Theme
        .of(context)
        .platform == TargetPlatform.iOS ?
    CupertinoActivityIndicator() : CircularProgressIndicator();
  }
}

Поэтому выше подходите к созданию виджета iOS и Android / Fuchsia соответственно. Вы можете определить любой виджет как это