Созданием списка с подсветкой выбранного элемента в Flutter

Чтобы создать список опций и выделить выбранную опцию в Flutter, можно использовать такие виджеты, как ListView, ListTile, и управлять состоянием с помощью простого подхода, например, через setState, или более продвинутого, такого как Provider, flutter_bloc и т.д. Ниже приведен пример использования ListView и setState для простой реализации:

Пример:

import 'package:flutter/material.dart';

class OptionSelection extends StatefulWidget {
  @override
  _OptionSelectionState createState() => _OptionSelectionState();
}

class _OptionSelectionState extends State<OptionSelection> {
  // Переменная для хранения индекса выбранной опции
  int _selectedIndex = -1;

  // Пример списка опций
  final List<String> _options = [
    'Опция 1',
    'Опция 2',
    'Опция 3',
    'Опция 4',
    'Опция 5',
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Выберите опцию'),
      ),
      body: ListView.builder(
        itemCount: _options.length,
        itemBuilder: (context, index) {
          return ListTile(
            title: Text(_options[index]),
            // Выделение выбранной опции
            tileColor: _selectedIndex == index ? Colors.blue[100] : null,
            onTap: () {
              setState(() {
                _selectedIndex = index;
              });
            },
          );
        },
      ),
    );
  }
}

void main() => runApp(MaterialApp(home: OptionSelection()));

Объяснение:

1. Управление состоянием с помощью setState:
   Мы используем переменную _selectedIndex, чтобы хранить индекс выбранного элемента. Когда пользователь нажимает на опцию, onTap обновляет _selectedIndex.

2. ListView и ListTile:
   Мы используем ListView.builder для создания прокручиваемого списка опций. В каждом элементе списка используется виджет ListTile для отображения текста.

3. Выделение выбранной опции:
   Мы применяем свойство tileColor в ListTile, чтобы изменить цвет фона выбранной опции на основе значения _selectedIndex.

Результат:

Когда вы нажимаете на опцию, она выделяется цветом фона, показывая, что она выбрана.

Этот пример можно настроить дальше, добавив анимацию или используя более сложные подходы к управлению состоянием, если потребуется.