ExpansionTile

Widżet ExpansionTile służy do tworzenia rozszerzalnych i zwijanych kafelków list. Ten widżet umożliwia tworzenie szczegółowego kafelka, którego można używać jako części widoku listy. W przypadku wielu aplikacji musimy pokazać szczegółowe informacje na liście, ale do tego nie mamy wystarczająco dużo miejsca, aby rozwinąć i zwinąć listę, możemy wtedy użyć widżetu ExpansionTile.

Właściwości ExpansionTile:

title — umożliwia wybranie tytułu widżetu kafelka rozszerzenia. Będzie on zawsze widoczny dla użytkownika.

subtitle — umożliwia dodanie podtytułu.

backgroundColor — nadaje kolor tła rozwiniętego kafelka. Zauważ, że przypisuje on kolor do rozszerzonego kafelka, a nie do tytułu.

collapsedBackgroundColor — nadaje kolor tła tytułu.

collapsedTextColor — nadaje kolor tekstu, który jest tytyułem i podtydtułem.

textColor — nadaje kolor tekstu rozszerzonego kafelka.

collapsedIconColor — nadaje kolor ikony, która znajduje się obok tytułu.

iconColor — nadaje kolor ikony rozszerzonego kafelka.

trailing — umożliwia zmianę ikony obok tytułu po prawej stronie, ale można użyć tekstu czy innych właściwości.

children — zawiera dowolną liczbę widżetów. Może to być wizytówka z prostym tekstem. Tylko po kliknięciu w tytuł widżetu, będziemy widzieli te kafelki rozszerzenia.

leading — umożliwia dodanie ikony, tekstu i innych właściwości po lewej stronie tytułu oraz po lewej stronie rozszerzanych kafelków.

---

Pełny kod, który tworzy powyższy przykład:

Scaffold(
        appBar: AppBar(
          title: const Text('ExpansionTile'),
        ),
        body: const ExpansionTile(
          title: Text(
            'Kolory',
            style: TextStyle(
              fontSize: 24,
              fontWeight: FontWeight.bold,
            ),
          ),
          subtitle: Text('Rozwiń ten kafelek, aby zobaczyć jego zawartość'),
          backgroundColor: Color.fromARGB(255, 210, 226, 211),
          collapsedBackgroundColor: Colors.indigo,
          collapsedTextColor: Colors.amber,
          textColor: Colors.green,
          collapsedIconColor: Colors.blue,
          iconColor: Colors.black,
          trailing: Icon(Icons.menu_open),
          children: [
            ListTile(
              leading: CircleAvatar(
                backgroundColor: Colors.red,
              ),
              trailing: Icon(Icons.touch_app),
              title: Text('Czerwony'),
            ),
            ListTile(
              leading: CircleAvatar(
                backgroundColor: Colors.blue,
              ),
              trailing: Icon(Icons.touch_app),
              title: Text('Niebieski'),
            ),
            ListTile(
              leading: CircleAvatar(
                backgroundColor: Colors.yellow,
              ),
              trailing: Icon(Icons.touch_app),
              title: Text('Żółty'),
            ),
          ],
        ),
      ),

---

PODSUMOWANIE: W tym artykule wyjaśniłam płytkę rozszerzenia czyli widżet ExpansionTile, który możesz modyfikować i eksperymentować według własnego upodobania. Mam nadzieję, że ten blog dostarczy Ci wystarczających informacji na temat wypróbowania tego widżetu w twoim projekcie Flutter. ❤ ❤ Dzięki za przeczytanie tego artykułu ❤❤