Card 是卡片组件块,内容可以由大多数类型的 Widget 构成,Card 具有圆角和阴影,这让它看起来有立体感。
 
Card组件的常用属性:
属性 说明
margin 外边距
child 子组件
shape Card的阴影效果,默认的阴影效果为圆角的长方形边

import 'package:flutter/material.dart';

void main() {
runApp(MaterialApp(
title: "CardWidget",
home: MyApp(),
));
} class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
children: <Widget>[
Card(
margin: EdgeInsets.all(10),
child: Column(
children: <Widget>[
ListTile(
title: Text("张三",style: TextStyle(fontSize: 28)),
subtitle: Text("董事长"),
),
Divider(),
ListTile(
title: Text("电话:123456789"),
),
ListTile(title: Text("地址:xxxxxxxxxxxxxxxxx"))
],
),
),
Card(
margin: EdgeInsets.all(10),
child: Column(
children: <Widget>[
ListTile(
title: Text("李四",style: TextStyle(fontSize: 28)),
subtitle: Text("CEO"),
),
Divider(),
ListTile(
title: Text("电话:123456789"),
),
ListTile(title: Text("地址:xxxxxxxxxxxxxxxxx"))
],
),
),
],
),
);
}
}

Flutter——Card组件的更多相关文章

  1. Flutter 父子组件传值

    Flutter 父子组件传值 一父传子: 父中: void onButtonChange(val1,val2,val3){ print('============================子向父 ...

  2. flutter Container组件和Text组件

    在开始之前,我们先写一个最简单的入口文件:     后面,都是在这个结构的基础上面完成的. 由于Container组件和Text组件都是写在body里面的,所以下面,先将body抽离成一个组件的形式. ...

  3. Vant Weapp小程序蹲坑之使用card组件显示价格

    问题 在基于mpvue+Vant Weapp组件库实战过程中,问题越来越多.网络上所谓的"坑"总结,仅仅不过是其开发中所遭所遇之"坑"而已--估计后面的&quo ...

  4. Flutter InkWell - Flutter每周一组件

    Flutter Inkwell使用详解 该文章属于[Flutter每周一组件]系列,其它组件可以查看该系列下的文章,该系列会不间断更新:所有组件的demo已经上传值Github: https://gi ...

  5. Flutter ListTile - Flutter每周一组件

    该文章属于[Flutter每周一组件]系列,其它组件可以查看该系列下的文章,该系列会不间断更新:所有组件的demo已经上传值Github: https://github.com/xj124456/fl ...

  6. 11 - Vue3 UI Framework - Card 组件

    卡片是非常常用也是非常重要的组件,特别是在移动端的众多应用场景中,随便打开一个手机 App ,您会发现充斥着各种各样的卡片. 所以,我们也来制作一个简易的 Card 组件 返回阅读列表点击 这里 需求 ...

  7. Jx.Cms开发笔记(四)-改造Card组件

    在Blazor 组件库 BootstrapBlazor 中Card组件介绍中我们说过,如果我们使用了Card组件的IsCollapsible属性设置了可伸缩的话,就只能使用Text属性来设置标题文本, ...

  8. flutter Card卡片列表组件

    一个 Material Design 卡片.拥有一个圆角和阴影 import 'package:flutter/material.dart'; import './model/post.dart'; ...

  9. Flutter常用组件(Widget)解析-ListView

    一个可滚动的列表组件 不管在哪,列表组件都尤为重要和常用. 首先来看个例子: import 'package:flutter/material.dart'; void main () => ru ...

随机推荐

  1. MySQL数据库表的设计和优化(下)

    二.基于单表设计的多表设计原则:(1)表关系: 一)一对一关系: 定义: 在这种关系中,关系表的每一边都只能存在一个记录.每个数据表中的关键字在对应的关系表中只能存在一个记录或者没有对应的记录.这种关 ...

  2. 《Hadoop大数据技术开发实战》学习笔记(一)

    基于CentOS7系统 新建用户 1.使用"su-"命令切换到root用户,然后执行命令: adduser zonkidd 2.执行以下命令,设置用户zonkidd的密码: pas ...

  3. kolla安装Queens版本OpenStack(ceph后端)

    OpenStack all-in-one部署: 本次部署为OpenStack Queens版本部署,使用All-in-one,单节点部署. 物理资源:8核,32GB,硬盘400GB(3个盘),2网卡. ...

  4. redis事务、并发及应用场景

    目录 事务概念 事务命令 乐观锁 悲观锁 并发控制及过期时间 队列 队列防丢失 阻塞队列 时间区间控制 持久化 RDB AOF 命令追加 文件写入.同步 RDB.AOF优缺点 RDB优缺 AOF优缺 ...

  5. PO,VO,DAO,BO,POJO之间的区别与解释

    VO value object:值对象 通常用于业务层之间的数据传递,由new创建,由GC回收. PO persistant object:持久层对象 对应数据库中表的字段. VO和PO,都是属性加上 ...

  6. Python之并行编程笔记

    概述: 非并发: 1 程序由单个步骤序列构成  2 包含独立子任务的程序执行性能低 并发:  1 异步.高效  2 分解子任务.简化流程与逻辑 进程process:1 一个程序的执行实例  2 每个进 ...

  7. 硬件实现IIC协议读取EEPROM

    我TMD也是服了,反正我板子搞了半天也不成功我也不知道为什么,野火STM32-MINI,一直卡EV5,不管了 先代码沾上 工程目录(板子为野火STM32 MINI) 串口相关代码: bsp_usart ...

  8. harbor上传镜像

    在harbor服务器 1. 下载测试上传使用的镜像docker pull hello-world2. 打tagdocker tag docker.io/hello-world:latest 172.1 ...

  9. MacBook使用HHKB键盘设置

    问题: macbook上使用hhkb的时候,很纠结档位4要不要开,开启4号DIP开关后,虽然会使HHKB键盘上减少一个“◇(Win键)”键,但是会在键盘左侧多出一个“FN”键.多出来的左“FN”键,不 ...

  10. Unity场景间数据传递方法

    在游戏开发中,会常用到场景间传递数据的方法(比如关卡选择,过关后自动回到关卡选择界面,以动画方式解锁下一关),目前研究了三种: 1. 使用DontDestroyOnLoad方法: (1)在场景A中做个 ...