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

Виджет Stack в Flutter

Виджет Stack рисует потомков в одной плоскости, как стопку бумаги. Первый элемент списка children лежит внизу, следующие перекрывают его сверху. Размер стека по умолчанию подстраивается под самого крупного потомка без Positioned:

import 'package:flutter/material.dart'; void main() { runApp(const MaterialApp(home: HomePage())); } class HomePage extends StatelessWidget { const HomePage({super.key}); @override Widget build(BuildContext context) { return Scaffold( body: Center( child: Stack( alignment: Alignment.center, children: [ Icon(Icons.circle, size: 80, color: Colors.teal), const Icon(Icons.check, size: 40, color: Colors.white), ], ), ), ); } }

Параметр alignment у Stack задаёт, как потомки без Positioned группируются, если их несколько и они меньше области. Для точного прижатия к краям используют Positioned - отдельный урок про него:

Stack( children: [ Image.network( 'https://picsum.photos/200', width: 200, height: 120, fit: BoxFit.cover, ), const Positioned( left: 8, bottom: 8, child: Text( 'Caption', style: TextStyle(color: Colors.white), ), ), ], )

Соберите Stack по центру экрана: снизу Icon Icons.lens размером 100 с цветом Colors.amber, сверху по центру стека Icon Icons.star размером 36. Используйте alignment: Alignment.center у Stack для звезды.

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