Элементы списка
Часть раздела Списки и экраны путешествия по Flutter на Coddy. Урок 2 из 33.
Большинство строк в списке выглядят похоже: основная строка, иногда строка поменьше под ней, возможно, значок с каждой стороны. ListTile — это готовая строка с нужными размерами и отступами.
ListTile(
title: Text('Ada Lovelace'),
subtitle: Text('+1 555 0101'),
)title — это основная строка. subtitle располагается под ней, имеет меньший размер и более мягкий цвет. Оба параметра принимают виджет, обычно Text.
ListTile имеет ту же ширину, что и список, и увеличивается, чтобы вместить две строки, если у него есть подзаголовок. Добавь несколько таких элементов в ListView, и получится список контактов.
Задание
ЛегкоСтрока Ады уже является элементом ListTile. Преврати два других текста в элементы, как у неё:
Alan Turingс подзаголовком+1 555 0102Grace Hopperс подзаголовком+1 555 0103
Попробуйте сами
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AppBar(title: const Text('Contacts')),
body: ListView(
children: const [
ListTile(
title: Text('Ada Lovelace'),
subtitle: Text('+1 555 0101'),
),
Text('Alan Turing'),
Text('Grace Hopper'),
],
),
),
);
}
}
В этом уроке есть небольшой тест. Начните урок, чтобы ответить на вопросы и сохранить прогресс.
Все уроки раздела Списки и экраны
1Прокручиваемые списки
Список с прокруткойЭлементы спискаНачало и конецНажатие на элемент спискаРазделители между строками6Вкладки, боковые панели и свайпы
Вкладки с панелью навигацииЗаливные значки для открытой вкладкиБоковая панельУдаление свайпомОтмена свайпаПотренируйтесь самостоятельно: Онлайн-компилятор Flutter