Класс PreferredSize

Класс PreferredSize оборачивает виджет с фиксированной высотой для AppBar. Высоту передают в preferredSize, содержимое - в child. TabBar уже реализует PreferredSizeWidget, PreferredSize используют для кастомной bottom полосы.

Синтаксис

PreferredSize(
	preferredSize: Size.fromHeight(48),
	child: TabBar(tabs: [Tab(text: 'abcde')]),
)

Параметры

Параметр	Описание
`preferredSize`	Размер, который запрашивает виджет у `AppBar`.
`child`	Содержимое полосы.

Пример

Давайте поставим TabBar в bottom AppBar:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: DefaultTabController(
				length: 2,
				child: Scaffold(
					appBar: AppBar(
						bottom: TabBar(
							tabs: [
								Tab(text: 'abcde'),
								Tab(text: '12345'),
							],
						),
					),
					body: TabBarView(
						children: [
							Center(child: Text('11111')),
							Center(child: Text('22222')),
						],
					),
				),
			),
		),
	);
}

AppBar расширяется под высоту TabBar.

Пример

Давайте зададим кастомную высоту bottom:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				appBar: AppBar(
					title: Text('abcde'),
					bottom: PreferredSize(
						preferredSize: Size.fromHeight(56),
						child: Container(
							color: Colors.grey.shade200,
							child: Center(child: Text('12345')),
						),
					),
				),
				body: Center(child: Text('11111')),
			),
		),
	);
}

Под заголовком серая полоса высотой 56 с текстом '12345'.

Смотрите также

виджет AppBar,
куда передают bottom
виджет TabBar,
который сам задаёт preferredSize
виджет SizedBox,
которым фиксируют высоту child
виджет SliverAppBar,
где тоже важна высота шапки