所以我在顫動中看到了這種奇怪的行為，那就是當我使用 SvgPicture 作為 IconButton 或 InkWell 的子小部件時。
我有這張卡，它有兩部分，由分隔線隔開。第一部分是顯示卡片名稱的 TextWidget，第二部分是 SVG（添加按鈕圖示）
Card(
elevation: 0,
child: Column(
children: [
Text(
cardName,
),
Divider(
color: dividerColor,
),
SvgPicture.asset(
'assets/icons/add_button_icon.svg',
color: iconColor,
),
],
),
);
我想做的事 ？ 我希望能夠在單擊此卡時執行一個功能（無論是 cardName 還是我正在使用的 SVG 圖示）
我做了什么？
- 我將整張卡片包裹在 InkWell 中并添加了 onTap 回呼。現在的問題是該功能僅在單擊卡的名稱時才會執行。無論我點擊多少 SVG 圖示，它都不會被呼叫。
- 然后我還嘗試添加另一個 InkWell 作為此 SVG 圖示的父級，但沒有成功。無論我點擊多少，它都不會被呼叫。
- 我認為我使用 InkWell 作為這個 SVG 的父級可能存在一些問題。然后我將這個 SVG 包裝在 IconButton 中，并嘗試給它一個 onPressed 回呼。這也不起作用。
無論我把 InkWell 放在哪里，只有當我點擊卡片名稱而不是整個卡片或 SVG 圖示時才會執行回呼。
知道我做錯了什么以及如何解決這個問題嗎？
編輯：整個小部件看起來像這樣：
InkWell renderCard(
BuildContext context,
String cardName,
int index,
int? counter,
Color dividerColor,
Color textColor,
Color iconColor,
void Function() onPress) {
return InkWell(
onTap: onPress,
child: Card(
elevation: 0,
color: index == counter ? cPrimaryColor : cSecondaryColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(cDefaultPadding),
),
child: Padding(
padding: const EdgeInsets.symmetric(vertical: cDefaultPadding),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
cardName,
style: Theme.of(context).textTheme.titleMedium!.copyWith(
color: textColor,
fontSize:
2.2 * TextSizeConfig.blockSizeVertical!.toDouble()),
),
Divider(
color: dividerColor,
),
spacer(1),
SvgPicture.asset(
'assets/icons/add_button_icon.svg',
color: iconColor,
),
spacer(1),
Text(
'ADD DOCUMENT',
style: Theme.of(context).textTheme.bodyMedium!.copyWith(
color: textColor,
fontSize:
1.5 * TextSizeConfig.blockSizeVertical!.toDouble()),
),
],
),
),
),
);
}
整體結構：SafeArea -> SingleChildScrollView -> Column -> Stack -> Column -> renderCard
uj5u.com熱心網友回復：
嘗試為影像名稱創建區域變數：
final String assetImage = 'assets/icons/add_button_icon.svg';
Card(
elevation: 0,
child: Column(
children: [
Text(
cardName,
),
Divider(
color: dividerColor,
),
SvgPicture.asset(
assetImage,
color: iconColor,
),
],
),
);
uj5u.com熱心網友回復：
我測驗了你的圖示，這是我的代碼：
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: Center(
child: InkWell(
onTap: (() => print('tapped')),
child: Card(
elevation: 0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Text('name'),
const Divider(color: Colors.red,),
SvgPicture.asset('assets/icons/plus.svg', color: Colors.blue,)
],
),
),
),
),
);
}
當我單擊該圖示時，它可以作業。看這里
uj5u.com熱心網友回復：
我按原樣運行您的示例，將這張卡包裝在一個 InkWell 中沒有問題，這是一個顯示它作業的小部件檢查。
也許它來自您使用的庫，甚至是另一個問題。您可以發送更完整的代碼片段嗎？
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/471842.html