Кнопка на изображении выше - это то, что я пытаюсь воспроизвести. При нажатии на него должен отображаться список различных температурных единиц. Я начал с поднятой кнопки и обнаружил, что не просто отобразить всплывающий список. Поэтому я изменил его, чтобы использовать контейнер. Это работает за исключением эффекта ряби, когда нажатие на кнопку отсутствует. Если я уберу цвет BoxDecoration, он будет работать, но я хочу, чтобы цвет кнопки был белым. Есть ли способ сделать это?
Expanded(
flex: 2,
child: PopupMenuButton(
elevation: 3.0,
onSelected: (String value) {
setState(() {
_selection = value;
});
},
child: Container(
height: double.maxFinite,
width: double.maxFinite,
child: Center(
child: Text(
'C\n\nCelsius',
textAlign: TextAlign.center,
),
),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(10),
border: Border.all(
color: Colors.grey[kButtonBorderShade],
width: 0.5)),
),
itemBuilder: (BuildContext context) =>
<PopupMenuEntry<String>>[
const PopupMenuItem<String>(
value: 'Value1',
child: Text('Choose value 1'),
),
const PopupMenuItem<String>(
value: 'Value2',
child: Text('Choose value 2'),
),
const PopupMenuItem<String>(
value: 'Value3',
child: Text('Choose value 3'),
),
],
),
),
Редактировать: Спасибо за ответ ниже. Я получил это работает именно так, как я хотел, с учетом совета. Вот моя последняя кнопка:
Expanded(
flex: 2,
child: ClipRRect(
borderRadius: BorderRadius.all(
Radius.circular(10),
),
child: Material(
color: Colors.white,
child: PopupMenuButton(
onSelected: (String value) {
setState(() {
_selection = value;
});
},
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
border: Border.all(
color:
Colors.grey[kButtonBorderShade],
width: 0.5)),
child: Center(
child: Text(
'C\n\nCelsius',
textAlign: TextAlign.center,
),
),
),
itemBuilder: (BuildContext context) =>
<PopupMenuEntry<String>>[
const PopupMenuItem<String>(
value: 'Value1',
child: Text('Choose value 1'),
),
const PopupMenuItem<String>(
value: 'Value2',
child: Text('Choose value 2'),
),
const PopupMenuItem<String>(
value: 'Value3',
child: Text('Choose value 3'),
),
],
),
),
),
),