[Flutter]Button

更新於 2024/12/11閱讀時間約 1 分鐘

樣式

  • RaisedButton:凸起
  • FlatButton:扁平化
  • OutlineButton:邊框
  • IconButton:圖示


屬性

  • onPressed:按下後觸發方法,若是 null 則不能用。
RaisedButton(
child: Text('Click'),
onPressed: btnClick,
)

void btnClick() {
print('btnClick');
}


  • color:按鈕顏色
RaisedButton(
child: Text('Click'),
onPressed: btnClick,
color: Color.fromARGB(255, 255, 255, 255),
)


  • textColor:按鈕中顯示文字的顏色
RaisedButton(
child: Text('Click'),
onPressed: btnClick,
textColor:: Color.fromARGB(255, 255, 255, 255),
)


  • elevation:按鈕陰影大小值
RaisedButton(
child: Text('Click'),
onPressed: btnClick,
elevation: 20,
)




avatar-img
8會員
123內容數
嗨,我是一名程式設計師,會在這分享開發與學習紀錄。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
小黑與程式的邂逅 的其他內容
顯示文字 Text('123456') 限制行數 Text('1\n2\n3\n4\n5\n6', maxLines: 2) 顯示樣式 字體大小 Text('123456', style: TextStyle(fontSize: 30)) 字體顏色 Text('12345
Container child:可以設定一個子元件 Container(child:Text('child')); color:背景顏色 Container(color: Color.fromARGB(255, 255, 255, 255)); alignment:對齊方式 Co
顯示文字 Text('123456') 限制行數 Text('1\n2\n3\n4\n5\n6', maxLines: 2) 顯示樣式 字體大小 Text('123456', style: TextStyle(fontSize: 30)) 字體顏色 Text('12345
Container child:可以設定一個子元件 Container(child:Text('child')); color:背景顏色 Container(color: Color.fromARGB(255, 255, 255, 255)); alignment:對齊方式 Co
你可能也想看
Google News 追蹤
Thumbnail
徵的就是你 🫵 超ㄅㄧㄤˋ 獎品搭配超瞎趴的四大主題,等你踹共啦!還有機會獲得經典的「偉士牌樂高」喔!馬上來參加本次的活動吧!
Thumbnail
隨著理財資訊的普及,越來越多台灣人不再將資產侷限於台股,而是將視野拓展到國際市場。特別是美國市場,其豐富的理財選擇,讓不少人開始思考將資金配置於海外市場的可能性。 然而,要參與美國市場並不只是盲目跟隨標的這麼簡單,而是需要策略和方式,尤其對新手而言,除了選股以外還會遇到語言、開戶流程、Ap
Thumbnail
在本文中,我們將介紹 TextField 文字輸入框元件及其基本用法。TextField 是一個關鍵的元件,使用者可以輕鬆地輸入文字,廣泛應用於各類應用程式中,如表單、搜尋框和聊天介面等。
Thumbnail
本篇文章將深入探討如何在 Flutter 中使用 Image 圖片元件。我們將涵蓋從資源管理到顯示本地資料夾中的圖片,以及如何載入網路圖片的完整過程。透過這篇文章,您將學會如何有效地管理圖片資源,並在應用程式中正確顯示圖片,提升您的 Flutter 開發技能。
Thumbnail
這篇文章深入探討了 Flutter 框架中的 ElevatedButton(漂浮按鈕)元件。文章介紹了其基本用法,包括必填參數 onPressed 和 child 的解析,並示範了如何使用匿名函數來處理按鈕點擊事件。此外,還說明了如何設定按鈕的顏色和形狀,並提供了完整的範例程式碼。
Thumbnail
在本篇教學中,我們介紹了 Flutter 中的 Row 和 Column 佈局容器,並探討了它們的基本用法及進階技巧。此外,我們還提到如何使用快捷鍵來格式化程式碼,以提升可讀性。
Thumbnail
本文深入探討 Flutter 中的 Container 元件,這是一個多功能的包裝 Widget,能夠有效管理和裝飾其他 Widget。文章將詳細說明如何調整 Container 的大小、設置外部間距(margin)以及使用 BoxDecoration 來自訂樣式。
今天來寫點FLutter的筆記吧 如果我們想要在APP中限制使用者的畫面顯示方向,不支持使用者橫放造成畫面佈局異常,或是想要在全螢幕顯示強制變橫向顯示,該怎麼做呢?
Thumbnail
前一篇我們介紹了遊戲模板的基本架構,在這篇文章中會記錄目前的開發進度,主要先把遊戲核心邏輯寫完,再慢慢完成其他功能,在這系列的文章中,我不會太聚焦於寫程式的部分,如果想看程式內容的話,可以到我的 github 上看喔,讓我們開始吧!
Thumbnail
前一篇說到遊戲開發的契機以及介紹了開發工具與官方提供的遊戲模板,在這一篇文章中,會開始進行遊戲的設計與製作,目標是上架到 Google Play 與 App Store 平台上,讓我們開始吧!
Thumbnail
前言 當今時代,遊戲已經不再只是單純的娛樂,更成為人們生活中不可或缺的一部分。隨著技術的發展,遊戲也從單機遊戲轉變成網路遊戲、手機遊戲、虛擬實境(VR)遊戲等多種形式。Flutter 作為一種跨平台的開發框架,正逐漸成為開發遊戲的一個重要工具。本系列文章將以「輕鬆入門 Flutter 遊戲開發」為題
Thumbnail
Introduction Flutter is a powerful framework for developing the app for different platforms without redevelopment. main.dart route routing map
Thumbnail
徵的就是你 🫵 超ㄅㄧㄤˋ 獎品搭配超瞎趴的四大主題,等你踹共啦!還有機會獲得經典的「偉士牌樂高」喔!馬上來參加本次的活動吧!
Thumbnail
隨著理財資訊的普及,越來越多台灣人不再將資產侷限於台股,而是將視野拓展到國際市場。特別是美國市場,其豐富的理財選擇,讓不少人開始思考將資金配置於海外市場的可能性。 然而,要參與美國市場並不只是盲目跟隨標的這麼簡單,而是需要策略和方式,尤其對新手而言,除了選股以外還會遇到語言、開戶流程、Ap
Thumbnail
在本文中,我們將介紹 TextField 文字輸入框元件及其基本用法。TextField 是一個關鍵的元件,使用者可以輕鬆地輸入文字,廣泛應用於各類應用程式中,如表單、搜尋框和聊天介面等。
Thumbnail
本篇文章將深入探討如何在 Flutter 中使用 Image 圖片元件。我們將涵蓋從資源管理到顯示本地資料夾中的圖片,以及如何載入網路圖片的完整過程。透過這篇文章,您將學會如何有效地管理圖片資源,並在應用程式中正確顯示圖片,提升您的 Flutter 開發技能。
Thumbnail
這篇文章深入探討了 Flutter 框架中的 ElevatedButton(漂浮按鈕)元件。文章介紹了其基本用法,包括必填參數 onPressed 和 child 的解析,並示範了如何使用匿名函數來處理按鈕點擊事件。此外,還說明了如何設定按鈕的顏色和形狀,並提供了完整的範例程式碼。
Thumbnail
在本篇教學中,我們介紹了 Flutter 中的 Row 和 Column 佈局容器,並探討了它們的基本用法及進階技巧。此外,我們還提到如何使用快捷鍵來格式化程式碼,以提升可讀性。
Thumbnail
本文深入探討 Flutter 中的 Container 元件,這是一個多功能的包裝 Widget,能夠有效管理和裝飾其他 Widget。文章將詳細說明如何調整 Container 的大小、設置外部間距(margin)以及使用 BoxDecoration 來自訂樣式。
今天來寫點FLutter的筆記吧 如果我們想要在APP中限制使用者的畫面顯示方向,不支持使用者橫放造成畫面佈局異常,或是想要在全螢幕顯示強制變橫向顯示,該怎麼做呢?
Thumbnail
前一篇我們介紹了遊戲模板的基本架構,在這篇文章中會記錄目前的開發進度,主要先把遊戲核心邏輯寫完,再慢慢完成其他功能,在這系列的文章中,我不會太聚焦於寫程式的部分,如果想看程式內容的話,可以到我的 github 上看喔,讓我們開始吧!
Thumbnail
前一篇說到遊戲開發的契機以及介紹了開發工具與官方提供的遊戲模板,在這一篇文章中,會開始進行遊戲的設計與製作,目標是上架到 Google Play 與 App Store 平台上,讓我們開始吧!
Thumbnail
前言 當今時代,遊戲已經不再只是單純的娛樂,更成為人們生活中不可或缺的一部分。隨著技術的發展,遊戲也從單機遊戲轉變成網路遊戲、手機遊戲、虛擬實境(VR)遊戲等多種形式。Flutter 作為一種跨平台的開發框架,正逐漸成為開發遊戲的一個重要工具。本系列文章將以「輕鬆入門 Flutter 遊戲開發」為題
Thumbnail
Introduction Flutter is a powerful framework for developing the app for different platforms without redevelopment. main.dart route routing map