如何在 flutter 中創建 SimpleDialog 小部件的動態內容的最佳實踐？

Question

我有 simpleDialog 小部件，當我單擊其子項內的按鈕時，它可以動態更改其子項或其內容，如下例所示。

class PopupDailyMood extends StatefulWidget {
  const PopupDailyMood({Key? key}) : super(key: key);

  @override
  _PopupDailyMoodState createState() => _PopupDailyMoodState();
}

class _PopupDailyMoodState extends State<PopupDailyMood> {
  String mode = "selectMood";
  String mood = "";

  @override
  Widget build(BuildContext context) {
    double widthDialog = MediaQuery.of(context).size.width * 0.90;

    return SimpleDialog(
      insetPadding: EdgeInsets.symmetric(horizontal: 20),
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(8))),
      contentPadding: EdgeInsets.all(0),
      backgroundColor: Color(0XFF020202),
      elevation: 0,
      children: <Widget>[
        Container(
            width: widthDialog,
            padding: EdgeInsets.fromLTRB(14, 31, 14, 34),
            child: mode == "selectMood"
                ? moodSelect(context)
                : mode == "blockerConfirm"
                    ? blockerConfirm()
                    : mode == "done2"
                        ? done2()
                        : null)
      ],
    );
  }

問題..是否有另一種方法來創建動態簡單對話框，即可以在觸發某些操作時移動或更改簡單對話框？

Answer 1

是的，我不建議您在談論特定模式時使用字符串，您可以使用整數，但是這使得無法判斷每個值應該是什么：所以我向您展示：ENUMS

enum MoodState {
  MoodSelect,
  BlockerConfirm,
  Done2,
}

如果你在某個文件中像上面那樣聲明一個枚舉，你現在可以這樣做：

mode == MoodState.MoodSelect
                ? moodSelect(context)
                : mode == MoodState.BlockerConfirm
                    ? blockerConfirm()
                    : mode == MoodState.Done2
                        ? done2()
                        : null)

這有助於拼寫錯誤，並允許 Intellisense 了解您想要執行的操作。 但它仍然有點笨重，那么為什么不把它移到 function 呢？

Widget _buildDialog(MoodState state) {
  switch (state) {
    case MoodState.MoodSelect: return moodSelect(context);
    case MoodState.BlockerConfirm: return blockerConfirm();
    case MoodState.Done2: return done2();
  }
}

您也可以將其放入類型為 map 的Map<MoodState, Widget>並像這樣獲取它： child: myMap[moodState]