我有 2 Inkwells 是 pageView 的控制器,當我按下任何一個時都會切換到相應的頁面。
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(0, 12, 1, 0),
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 0, 0, 0),
child: InkWell(
onTap: () async {
isSecondButton = false;
isFirstButton = true;
setState(() {});
await pageViewController.animateToPage(
0,
duration: const Duration(milliseconds: 500),
curve: Curves.ease,
);
},
child: Material(
color: Colors.transparent,
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xFF0D1821),
borderRadius: BorderRadius.circular(8),
shape: BoxShape.rectangle,
border: isFirstButton
? Border.all(color: Colors.white)
: null),
child: Stack(
children: [
Align(
alignment: const AlignmentDirectional(
0, -0.05),
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Image.asset(
'assets/images/memes/standardbuild.jpg',
width: 50,
height: 50,
fit: BoxFit.cover,
),
Padding(
padding: EdgeInsetsDirectional
.fromSTEB(0, 8, 0, 0),
child: AutoSizeText(
'STANDARD BUILD',
textAlign: TextAlign.center,
style: GoogleFonts.lexendDeca(
color: Color(0xFF8B97A2),
fontSize: 13,
fontWeight:
FontWeight.normal,
),
),
),
],
),
),
],
),
),
),
),
),
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 0, 0, 0),
child: Material(
color: Colors.transparent,
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xFF0D1821),
borderRadius: BorderRadius.circular(8),
border: isSecondButton
? Border.all(color: Colors.white)
: null),
child: InkWell(
onTap: () async {
isSecondButton = true;
isFirstButton = false;
setState(() {});
await pageViewController.animateToPage(
1,
duration:
const Duration(milliseconds: 500),
curve: Curves.ease,
);
},
child: Stack(
children: [
Align(
alignment: const AlignmentDirectional(
0, -0.05),
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Image.asset(
'assets/images/memes/pepechad.png',
width: 50,
height: 50,
fit: BoxFit.cover,
),
Padding(
padding: EdgeInsetsDirectional
.fromSTEB(0, 8, 0, 0),
child: AutoSizeText(
'ALTERNATIVE BUILD',
textAlign: TextAlign.center,
style: GoogleFonts.lexendDeca(
color: Color(0xFF8B97A2),
fontSize: 13,
fontWeight:
FontWeight.normal,
),
),
),
],
),
),
],
),
),
),
),
),
],
),
),
),
最重要的是,我想補充一點,同樣onTap要更改小部件的另一個值,該值是一個簡單的字串,存盤在模型資料中,并使用widget.data.tier1<-- 第一個值和widget.data.tier2<-- 第二個值呼叫:
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(0, 0, 0, 15),
child: AutoSizeText(
' lane',
style: GoogleFonts.lexendDeca(
color: Color(0xFF8B97A2),
),
),
),
Container(
width: MediaQuery.of(context).size.width,
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: [
AutoSizeText(
widget.data.tier,
style: GoogleFonts.lexendDeca(
color: Color(0xFFFFFFFF),
fontSize: 45,
fontWeight: FontWeight.normal,
),
),
例如:
onTap 1st button --> 對應的pageview page widget.data.tier1
2nd button --> 對應的pageview page widget.data.tier2
基本上添加了將 widget.data 從 1 更改為 2 的功能。
非常感謝任何澄清,如果有任何不清楚的地方我也很抱歉:P
這是它應該如何作業 對相應資料的“S”更改
uj5u.com熱心網友回復:
要使其作業的快速而骯臟的解決方案,請創建一個單例來保持層狀態。添加以下類:
class GlobalState {
static final GlobalState _globalState = GlobalState._();
factory GlobalState() {
return _globalState;
}
GlobalState._();
String tier = 'S';
}
在onTap您的 InkWells 中,將層級設定為您想要的任何值:
setState(() {
GlobalState().tier = 'S';
});
顯示層時,從單例中獲取值:
AutoSizeText(
GlobalState().tier,
...
我強烈建議考慮實施一個狀態管理庫,例如riverpod。
另外,我注意到您將兩者都初始化isFirstButton為isSecondButton假。如果您想默認為標準層,您可以初始化isFirstButton為 true 并將層變數初始化為“S”(如上面的單例)。
如果您希望更新整個 Data 物件,您還需要將它們存盤在單例中,以便應用程式的不同部分可以訪問/更新它們。這就是為什么全域狀態不是最好的解決方案,應該實施適當的狀態管理。但是,如果您愿意,可以使用單例來完成。
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/420869.html
標籤:
下一篇:帶有飛鏢的http請求
