Компонент Slidable иногда располагается поверх других компонентов, а иногда и снизу — FLUTTERIOS

Программируем под IOS
Ответить Пред. темаСлед. тема
Anonymous
 Компонент Slidable иногда располагается поверх других компонентов, а иногда и снизу — FLUTTER

Сообщение Anonymous »

Описание:
Я столкнулся с проблемой с компонентом Slidable в ListView во Flutter. Поведение компонента Slidable непоследовательно в зависимости от количества элементов в списке.
Проблема:
  • Если в ListView недостаточно элементов, требующих прокрутки, компонент Slidable при перемещении отображается поверх всех остальных компонентов.
  • Однако, когда ListView имеет достаточно элементов для возможности прокрутки, компонент Slidable при перемещении оказывается под другими компонентами.
Видео проблемы:
Видео
Код:

Код: Выделить всё

/* Events.dart */

Widget build(BuildContext context) {
return Container(
clipBehavior: Clip.none,
margin: const EdgeInsets.only(top: 5, bottom: 5, left: 10, right: 10),
child: ListView.builder(
itemCount: widget.lista.length,
shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
return Stack(clipBehavior: Clip.none, children: [
Positioned.fill(
child: Row(
children: [
Expanded(
child: Container(
margin: const EdgeInsets.only(bottom: 6),
decoration: const BoxDecoration(
color: Colors.red,
borderRadius: BorderRadius.all(Radius.circular(8))),
),
),
],
),
),
Slidable(
key: UniqueKey(),
endActionPane: ActionPane(
extentRatio: 0.2,
motion: const BehindMotion(),
children: [
GestureDetector(
onTap: () {
delete(context, widget.lista[index]);
},
child: Container(
margin: const EdgeInsets.only(bottom: 6),
padding: const EdgeInsets.only(left: 30),
decoration: const BoxDecoration(
borderRadius: BorderRadius.horizontal(
right: Radius.circular(15)),
color: Colors.red,
),
alignment: Alignment.center,
child: const Icon(Icons.delete_forever,
color: Colors.white),
),
),
]),
child: GestureDetector(
onTap: () {
Navigator.of(context).push(widget.action(
fetchRep: widget.fetchRep,
data: widget.data,
update: widget.update,
action: "mod_el",
report: widget.lista[index]));
},
child: Container(
padding: const EdgeInsets.all(10),
margin: const EdgeInsets.only(bottom: 6),
// margin: const EdgeInsets.fromLTRB(10, 3, 10, 3),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
border: Border.all(color: Colors.white, width: 1),
color: HexColor.fromHex(widget.lista[index].color),
),
child: Row(
children: [
Row(
children: [
Icon(
widget.lista[index].reportType == "R"
? Icons.assignment
: Icons.bookmark,
color: Colors.white,
size: 20,
),
const SizedBox(
width: 10,
),
],
),
Center(
child: Text(
"[  ${int.parse(widget.lista[index].quantity).toStringAsFixed(2)} ${widget.lista[index].unityCode}  ]",
style: const TextStyle(
color: Colors.white,
fontSize: 14,
fontWeight:  FontWeight.bold),
),
),
const SizedBox(
width: 20,
),
Expanded(
child: Text(
"${widget.lista[index].customerCode} - ${widget.lista[index].taskTypeCode}",
overflow: TextOverflow.ellipsis,
style: const TextStyle(
color: Colors.white,
fontSize: 14,
fontWeight: FontWeight.bold),
textAlign: TextAlign.center,
),
),
],
),
),
),
),
]);
},
),
);
}

Код: Выделить всё

/* ContainerEvents.dart */

Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.only(top: 15),
child: AnimatedVisibility(
enter: fadeIn(),
exit: fadeOut(),
child: Container(
width: MediaQuery.of(context).size.width,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Theme.of(context).colorScheme.tertiaryContainer,
),
child: widget.loading
? Center(
child: LoadingAnimationWidget.staggeredDotsWave(
color:
Theme.of(context).colorScheme.onTertiaryContainer,
size: 80,
),
)
: Column(
children: [
const SizedBox(
height: 10,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Text(
"${DateFormat.EEEE('it_IT').format(widget.selezionato)}, ${DateFormat.MMMd('it_IT').format(widget.selezionato)}, ${DateFormat.y('it_IT').format(widget.selezionato)}",
style: TextStyle(
color: Theme.of(context)
.colorScheme
.onTertiaryContainer,
fontSize:
MediaQuery.of(context).size.height /
100 *
2.5,
fontWeight: FontWeight.bold)),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Theme.of(context)
.colorScheme
.inverseSurface,
),
onPressed: () {
showModalBottomSheet(
transitionAnimationController:
AnimationController(
vsync: Navigator.of(context),
duration: const Duration(
milliseconds: 600))
..forward(),
context: context,
isScrollControlled: true,
builder: (context) =>  Filterbox(
fetchRep: widget.fetchRep,
data: widget.data,
aggiornaData: widget.dayReload),
);
},
child: Icon(
Icons.filter_alt,
color: Theme.of(context).colorScheme.surface,
))
],
),
const SizedBox(
height: 10,
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(bottom: 5),
child: Events(
data: widget.selezionato,
lista: widget.lista,
action: widget.createRoute,
fetchRep: widget.fetchRep,
update: widget.update),
)),
],
))),
);
}
Что я пробовал:
  • Я экспериментировал с различными стеками и позиционированием конфигурации.
Чего я хочу:
  • Я хочу, чтобы все ползунки всегда находились поверх других компонентов.


Подробнее здесь: https://stackoverflow.com/questions/787 ... ometimes-u
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «IOS»