簡體   English   中英

如何更改顫動 showAboutDialog 中的文本按鈕顏色?

[英]How can I change the textbutton color in the flutter showAboutDialog?

我正在使用showAboutDialog函數來顯示我的項目中使用的許可證。 我是如何堅持更改VIEW LICENSESCLOSE textbuttons 的文本顏色的。 請參閱此圖像以進行澄清:

關於對話框

這是我的代碼:

...
onTap: () {
  showAboutDialog(
    context: context,
    applicationName: 'bla',
    applicationLegalese: 'November 2023',
 );
},

到目前為止,我嘗試在showAboutDialog尋找顏色字段,但我找不到任何東西。 我假設我可以更改MaterialApp ThemeData的顏色。 不幸的是,我無法找到特定主題來覆蓋這些文本按鈕的默認樣式。

我在我的MaterialApp ThemeData嘗試了以下ThemeData來將VIEW LICENSESCLOSE的顏色更改為綠色,但這並沒有改變任何東西:

textButtonTheme: TextButtonThemeData(style: ButtonStyle(foregroundColor: MaterialStateProperty.all<Color>(Colors.green))

關於這個的任何想法?

我對這里的答案並不滿意,因為所有答案都只顯示了 MaterialColor 用例,而我想要自定義顏色。 但我終於在以下鏈接上找到了一些解釋得很好的東西。

https://blog.logrocket.com/new-material-buttons-in-flutter/

基本上,令人困惑的是新設計使用原色而不是 textStyle 屬性。 您仍然可以應用其他答案來使用 MaterialColor 更改整體主題,並且您可以通過使用 TextButton.styleFrom 下的主要顏色使用任何顏色覆蓋現有顏色主題。

應用程序中任何位置的示例:

TextButton(
      onPressed: () {},
      style: TextButton.styleFrom(
        primary: Colors.pink,
      ),
      child: Text(
        'TextButton (New)',
        style: TextStyle(fontSize: 30),
      ),
    )

主題示例:

textButtonTheme: TextButtonThemeData(
      style: TextButton.styleFrom(
        primary: kDarkColor, // This is a custom color variable
        textStyle: GoogleFonts.fredokaOne(),
      ),
    ),

你可以使用這個:

return MaterialApp(
      theme: ThemeData.dark().copyWith(
          textButtonTheme: TextButtonThemeData(
              style: ButtonStyle(
                  foregroundColor: MaterialStateProperty.resolveWith(
                      (state) => Colors.orange)))),
      home: MyWidget(),
    );

MaterialStateProperty.resolveWith帶一個函數,可以根據狀態指定顏色,比如

MaterialState.pressed,
MaterialState.hovered,
MaterialState.focused,

更多信息

這個怎么樣?

@override
Widget build(BuildContext context) {
  return MaterialApp(
    theme: ThemeData(
      primarySwatch: Colors.blue,
      colorScheme: ColorScheme.fromSwatch(
        primarySwatch: Colors.green,
      ).copyWith(),      
    ),
    debugShowCheckedModeBanner: false,
    home: YourScreen(),
  );
}

樣本

我運行這個代碼。 經過一些研究,我發現了這種改變顏色的方法。

為此,您需要設置應用程序主主題顏色更改,如下所示

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        primarySwatch: Colors.brown,//i am set brown colour,you can set your colour here 
      ),
      debugShowCheckedModeBanner: false,
      home: YourScreen(),
    );
  }

在這之后它的工作,

showAboutDialog(
                  context: context,
                  applicationName: 'bla',
                  applicationLegalese: 'November 2023',
                );

在此處輸入圖片說明

如果您只想更改對話框的顏色而不是整個應用程序的顏色,則必須創建一個新的上下文。 ThemeBuilder包圍顯示對話框的按鈕

Theme(
    data: Theme.of(context).copyWith(
      colorScheme: colorScheme.copyWith(primary: Colors.green),
    ),
    child: Builder(
      builder: (context) {
        return ListTile(
          title: Text('show dialog'),               
          onTap: () => showAboutDialog(
                          context: context,
                          ...) 
        );
      },
    ),
  )

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM