颤振中的杆列对齐
颤振中的杆列对齐
提问于 2022-09-12 14:46:30
在应用程序的应用程序栏中，我包含了一个抽屉和其他图标，但是抽屉图标和其他元素之间有一个空格，我希望图标更接近抽屉图标。这就是我现在拥有的：
这就是我想要的样子：
这是我的公鸡
import 'package:custigrow/Utilities/expiry_information_card.dart';
import 'package:custigrow/Utilities/my_cards.dart';
import 'package:custigrow/Utilities/product_information_card.dart';
import 'package:custigrow/Utilities/sales_information_card.dart';
import 'package:custigrow/Utilities/transactions_card.dart';
import 'package:custigrow/screens/authenticate/sign_in.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'package:custigrow/Utilities/side_menu.dart';
class Home extends StatefulWidget {
Home({Key? key}) : super(key: key);
@override
State<Home> createState() => _HomeState();
}
class _HomeState extends State<Home> {
final user = FirebaseAuth.instance.currentUser;
@override
Widget build(BuildContext context) {
return DefaultTabController(
length: 2,
child: Scaffold(
drawer: SideMenu(),
backgroundColor: Color(0xFFE5E5E5),
appBar: AppBar(
iconTheme: IconThemeData(color: Colors.black),
toolbarHeight: 70,
elevation: 0.0,
backgroundColor: Color(0xFFE5E5E5),
title: Row(
children: [
Row(
children: [
Container(
padding: EdgeInsets.zero,
height: 50,
width: 80,
child: Image.asset("lib/assets/custigrow.png")),
],
),
Row(
children: [
Icon(
Icons.inbox_outlined,
color: Colors.grey[600],
),
SizedBox(
width: 20,
),
Icon(Icons.notifications_active_outlined,
color: Colors.grey[600]),
SizedBox(
width: 20,
),
CircleAvatar(
child: Container(
child: Icon(
Icons.person,
color: Colors.grey,
),
),
backgroundColor: Colors.grey[300],
),
],
)
],
),
),
body: Padding(
padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 20),
child: SingleChildScrollView(
child:
Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
"Dashboard",
style: TextStyle(fontSize: 35, letterSpacing: 0.2),
),
Container(
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 10, 15, 10),
child: Icon(
Icons.history,
size: 30,
color: Colors.green,
),
),
decoration: BoxDecoration(
border: Border.all(color: Colors.green, width: 2),
borderRadius: BorderRadius.circular(10),
),
)
],
),
Row(
children: [
Text(
"How are you today?",
style: TextStyle(fontSize: 18),
),
Image.asset(
"lib/assets/goodbye.png",
height: 20,
),
],
),
SizedBox(
height: 10,
),
Container(
height: 140,
child: PageView(
scrollDirection: Axis.horizontal,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 5),
child: MyCards(
title: "Revenue",
rate: 0,
icon: "lib/assets/moneyrounded.png",
balance: 0,
color: Colors.green,
),
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 5),
child: MyCards(
title: "Total Orders",
rate: 0,
icon: "lib/assets/clipboard2.png",
balance: 0,
color: Colors.blue),
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 5),
child: MyCards(
title: "Total Products",
rate: 0,
icon: "lib/assets/box.png",
balance: 0,
color: Colors.orange),
),
],
),
),
SizedBox(
height: 30,
),
//sales info card
SalesInfo(),
SizedBox(
height: 50,
),
//product info card
ProductInfo(),
SizedBox(
height: 50,
),
//expiry info card
ExpiryInfo(),
SizedBox(
height: 50,
),
//transaction card
TransactionsCard(),
SizedBox(
height: 30,
),
]),
),
),
),
);
}
}在应用程序的应用程序栏中，我包含了一个抽屉和其他图标，但是抽屉图标和其他元素之间有一个空格，我希望图标更接近抽屉图标。在应用程序的应用程序栏中，我包含了一个抽屉和其他图标，但是抽屉图标和其他元素之间有一个空格，我希望图标更接近抽屉图标。在应用程序的应用程序栏中，我包含了一个抽屉和其他图标，但是抽屉图标和其他元素之间有一个空格，我希望图标更接近抽屉图标。
回答 3
Stack Overflow用户
回答已采纳
发布于 2022-09-12 15:22:32
您可以对应用程序图标使用操作，并对徽标和菜单进行引导：
AppBar(
iconTheme: const IconThemeData(color: Colors.black),
toolbarHeight: 70,
elevation: 0.0,
backgroundColor: const Color(0xFFE5E5E5),
actions: [
Icon(
Icons.inbox_outlined,
color: Colors.grey[600],
),
const SizedBox(
width: 20,
),
Icon(Icons.notifications_active_outlined, color: Colors.grey[600]),
const SizedBox(
width: 10,
),
CircleAvatar(
child: const Icon(
Icons.person,
color: Colors.grey,
),
backgroundColor: Colors.grey[300],
),
const SizedBox(
width: 10,
),
],
leadingWidth: 120,
leading: GestureDetector(
onTap: () => key.currentState!.openDrawer(),
child: Row(
children: [
const SizedBox(width: 10),
const Icon(Icons.menu, color: Colors.black),
Container(
padding: EdgeInsets.zero,
height: 50,
width: 80,
child: Image.asset("lib/assets/custigrow.png")),
],
),
),
),Stack Overflow用户
发布于 2022-09-12 15:11:06
您可以将这些小部件放在应用程序栏的actions部分，如文档中所述，它将按照您的意愿对齐。
Stack Overflow用户
发布于 2022-09-12 16:13:51
使用actions使这些3-按钮正确对齐.
您将删除标题的appBar行，然后它可能解决您的徽标空间问题。如果没有，请尝试删除AppBar的内部(默认)填充。
Leading title和actions已经正确定义了，只需在它们中使用元素即可。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73691107
复制相关文章
相似问题
腾讯云开发者
