AppBar یک قطعه واسط کاربری است که در بالای صفحه نمایش داده میشود و به عنوان یک میزبان برای عناصر دیگری مانند عناصر منو یا دکمهها استفاده میشود. در فریمورک فلاتر، AppBar برای نمایش عناوین صفحه، دکمههای ناوبری و سایر ابزارهای کاربردی استفاده میشود. زیرا AppBar یک قطعه اساسی در طراحی رابط کاربری متوسط است.
تمام این ویژگیها را میتوانیم در ساخت یک AppBar سفارشی در فلاتر استفاده کنیم.
مثال:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Custom AppBar'),
backgroundColor: Colors.blue,
elevation: 4, // افزایش ارتفاع سایه
actions: [
IconButton(
icon: Icon(Icons.search),
onPressed: () {
},
),
IconButton(
icon: Icon(Icons.more_vert),
onPressed: () {
},
),
],
),
body: Center(
child: Text('Custom AppBar Example'),
),
),
);
}
}
در این مثال، یک AppBar سفارشی ایجاد شده است که شامل یک عنوان، یک پسزمینه رنگی، بلندی سایه، و دو دکمه عمل است.