Виджет Card
Виджет Card оборачивает блок в скруглённый лист с тенью.
Содержимое передают в child,
отступы внутри задают через margin снаружи и padding у child,
цвет - в color,
высоту тени - в elevation.
Внутри Card обычно ставят Column или ListTile.
Синтаксис
Card(
elevation: 4,
child: Padding(
padding: EdgeInsets.all(16),
child: Text('abcde'),
),
)
Параметры
| Параметр | Описание |
|---|---|
child |
Виджет внутри карточки. |
color |
Цвет поверхности карточки. |
elevation |
Высота тени под карточкой. |
margin |
Отступ карточки от соседей. |
Пример
Давайте покажем одну карточку по центру экрана:
import 'package:flutter/material.dart';
void main()
{
runApp(
MaterialApp(
home: Scaffold(
body: Center(
child: Card(
child: Padding(
padding: EdgeInsets.all(24),
child: Text('abcde'),
),
),
),
),
),
);
}
На экране белая карточка с тенью и текстом 'abcde'.
Пример
Давайте выведем список карточек:
import 'package:flutter/material.dart';
void main()
{
runApp(
MaterialApp(
home: Scaffold(
body: ListView(
padding: EdgeInsets.all(16),
children: [
Card(child: ListTile(title: Text('12345'))),
Card(child: ListTile(title: Text('abcde'))),
],
),
),
),
);
}
Две карточки с ListTile прокручиваются вертикально.