溫馨提示×

如何通過alertdialog獲取用戶輸入

小樊
82
2024-10-16 17:35:16
欄目: 編程語言

要通過AlertDialog獲取用戶輸入,您可以使用showDialog方法創(chuàng)建一個對話框,并在其中使用TextInputLayoutTextInputEditText組件來允許用戶輸入文本。以下是一個示例代碼,展示了如何在Flutter中實(shí)現(xiàn)這一功能:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('獲取用戶輸入')),
        body: Home(),
      ),
    );
  }
}

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  String userInput = '';

  void _getUserInput() async {
    final result = await showDialog(
      context: context,
      barrierDismissible: false,
      builder: (BuildContext context) {
        return AlertDialog(
          title: Text('請輸入文本'),
          content: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              TextFormField(
                decoration: InputDecoration(labelText: '輸入文本'),
                onChanged: (value) {
                  setState(() {
                    userInput = value;
                  });
                },
              ),
            ],
          ),
          actions: <Widget>[
            FlatButton(
              onPressed: () {
                Navigator.of(context).pop();
              },
              child: Text('確定'),
            ),
          ],
        );
      },
    );

    if (result != null && result.data is String) {
      userInput = result.data;
      // 在這里處理用戶輸入
      print('用戶輸入: $userInput');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        onPressed: _getUserInput,
        child: Text('獲取用戶輸入'),
      ),
    );
  }
}

在這個示例中,我們創(chuàng)建了一個_HomeState類,它繼承自StatefulWidget。在這個類中,我們定義了一個名為userInput的字符串變量來存儲用戶輸入的文本。我們還定義了一個名為_getUserInput的異步方法,該方法使用showDialog來顯示一個包含TextInputLayoutTextInputEditText組件的AlertDialog。用戶可以在其中輸入文本,點(diǎn)擊“確定”按鈕后,用戶輸入的文本將被存儲在userInput變量中,并打印出來。

0