Создаем портфолио за 1 месяц
К концу месяца: 4 классных проекта в вашем портфолио! Стоимость: 100$. Подробности...
⊗flPmMuEd 87 of 125 menu
◀ ▶

Редактирование выбранного элемента в Flutter

Редактирование без второго экрана делают так: в State хранят selectedIndex - номер выбранной строки или null, если ничего не выбрано. Над списком или под ним - TextField с контроллером.

При выборе строки копируют её текст в контроллер и запоминают индекс. Кнопка «Сохранить» записывает controller.text в items[selectedIndex] и вызывает setState. Так пользователь видит и список, и поле правки одновременно:

import 'package:flutter/material.dart'; void main() { runApp(const MaterialApp(home: HomePage())); } class HomePage extends StatefulWidget { const HomePage({super.key}); @override State<HomePage> createState() => _HomePageState(); } class _HomePageState extends State<HomePage> { final items = <String>['Morning', 'Day', 'Evening']; final editController = TextEditingController(); int? selectedIndex; @override void dispose() { editController.dispose(); super.dispose(); } void selectItem(int index) { setState(() { selectedIndex = index; editController.text = items[index]; }); } void applyEdit() { final index = selectedIndex; if (index == null) return; setState(() { items[index] = editController.text.trim(); }); } @override Widget build(BuildContext context) { return Scaffold( body: Column( children: [ Padding( padding: const EdgeInsets.all(16), child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ TextField( controller: editController, decoration: const InputDecoration( labelText: 'Edit', border: OutlineInputBorder(), ), ), const SizedBox(height: 8), ElevatedButton( onPressed: applyEdit, child: const Text('Save'), ), ], ), ), Expanded( child: ListView.builder( itemCount: items.length, itemBuilder: (context, index) { final selected = index == selectedIndex; return ListTile( selected: selected, // highlight the active row title: Text(items[index]), onTap: () => selectItem(index), ); }, ), ), ], ), ); } }

Список из четырёх имён. Тап по строке загружает имя в поле сверху. Кнопка 'Apply' обновляет выбранный элемент списка. Выделение выбранной строки через selected: true.

← →
↑
Мы используем cookie для работы сайта, аналитики и персонализации. Обработка данных происходит согласно Политике конфиденциальности.
принять все настроить отклонить