Flutter深入浅出组件篇---Center、完结
Center介绍
Center
就是将子组件进行一个居中展示,它继承自Align
,因为Align
默认的对齐方式是居中的,所以它能实现居中效果,如果Center
的尺寸没有受到限制,那么它将尽可能大。
示例代码
【Flutter深入浅出组件篇---Center、完结】本文中很多效果都没有截图,可下载源代码运行项目 源代码地址,或者通过视频教程查看 视频教程地址
什么情况下使用Center?
当我们需要对子组件进行居中的时候使用Center
。
Center的属性和说明
字段 | 属性 | 描述 |
---|---|---|
widthFactor | double | 宽度系数 |
heightFactor | double | 高度系数 |
child | Widget | 子组件 |
import 'package:flutter/material.dart';
class CenterExample extends StatefulWidget {
@override
_CenterExampleState createState() => _CenterExampleState();
}class _CenterExampleState extends State {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("AlignExample"),
),
body: Center(
child: Text("Jimi"),
),
);
}
}
效果展示
文章图片
完结 我们对
Flutter
的所有容器类组件进行了一个讲解,那么此篇幅就已经完结了,在接下来我们继续讲解Flutter
的基础类组件。推荐阅读
- 深入浅出谈一下有关分布式消息技术(Kafka)
- 动态组件与v-once指令
- Flutter的ListView
- vue组件中为何data必须是一个函数()
- (六)Component初识组件
- Spring|Spring Boot 自动配置的原理、核心注解以及利用自动配置实现了自定义 Starter 组件
- vuex|vuex 基础结构
- SwiftUI|SwiftUI iOS 瀑布流组件之仿CollectionView不规则图文混合(教程含源码)
- 运用flutter|运用flutter 构建一个发布版(release)APK
- Vue组件之事件总线和消息发布订阅详解