Flutter——CircleAvatar组件(圆形头像组件)

import 'package:flutter/material.dart';
import 'res/listData.dart'; void main() {
runApp(MaterialApp(
title: "demo",
home: MyApp(),
));
} class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("FlutterDemo"),),
body: ListView(
children: listData.map((value) {
return Card(
margin: EdgeInsets.all(10),
child: Column(
children: <Widget>[
AspectRatio(
aspectRatio: 20/9,
child: Image.network(value["imageUrl"],fit: BoxFit.cover,),
),
ListTile(
leading: CircleAvatar(
backgroundImage: NetworkImage(value["imageUrl"]),
),
title: Text(value["title"]),
subtitle: Text(value["description"],maxLines: 1,overflow: TextOverflow.ellipsis),
)
],
),
);
}).toList()
)
);
}
}
Flutter——CircleAvatar组件(圆形头像组件)的更多相关文章
- Flutter 图片、圆形头像、圆角图片....各种形状
图片 1. 本地图片 Image.asset 加载项目资源包的图片 //先将图片拷贝到项目 images 目录中,然后在 pubspec.yaml文件配置文件相对路径到 assets Image.as ...
- 圆形头像以及一些常见需求形状自定义ImageView组件
在实际开发中,我们经常会遇到这样的需求,就是无论图片长啥样,我们都要其显示成圆形.圆形加一个边框.矩形加边框,带圆角的矩形等等,lib和demo下载地址:https://github.com/mapl ...
- 几行实现圆形头像,以及一些常见需求形状自定义ImageView组件
在实际开发中,我们经常会遇到这样的需求,就是无论图片长啥样,我们都要其显示成圆形.圆形加一个边框.矩形加边框,带圆角的矩形等等,我已把自己平常用的组件和demo上传到了github(https://g ...
- 【Flutter学习】基本组件之图片组件Image
一,概述 Image(图片组件)是显示图像的组件,一个显示图片的widget,支持图像格式:JPEG,PNG,GIF,动画GIF,WebP,动画WebP,BMP和WBMP. Image组件有多种构造函 ...
- 【Flutter实战】六大布局组件及半圆菜单案例
老孟导读:Flutter中布局组件有水平 / 垂直布局组件( Row 和 Column ).叠加布局组件( Stack 和 IndexedStack ).流式布局组件( Wrap )和 自定义布局组件 ...
- 丢掉Mask遮罩,更好的圆形Image组件[Unity]
写在前面 全文解析圆形Image组件的实现原理,取关键代码介绍算法细节,源码已经上传Github下载地址,欢迎下载试用. 一.Unity原生Image组件实现圆形图片的缺陷 Mask渲染消耗 许多游戏 ...
- flutter Container组件和Text组件
在开始之前,我们先写一个最简单的入口文件: 后面,都是在这个结构的基础上面完成的. 由于Container组件和Text组件都是写在body里面的,所以下面,先将body抽离成一个组件的形式. ...
- Flutter入门之有状态组件
StatefulComponent使用方法入门 在上一篇Flutter入门之无状态组件中我们讲到了无状态组件,所谓的无状态组件指的就是其内部的状态是来自其父组件并使用final类型的变量来存储,当组件 ...
- Flutter入门之无状态组件
Flutter核心理念 flutter组件采用函数式响应框架构建,它的灵感来自于React.它设计的核心思想是组件外构建UI,简单解释一下就是组件鉴于它当前的配置和状态来描述它的视图应该是怎样的,当组 ...
随机推荐
- LNMP一键环境安装多PHP版本共存的方法
多PHP版本只支持LNMP模式,LNMPA.LAMP模式下不支持!要使用多PHP先安装多PHP版本,在lnmp1.4源码(lnmp1.3的不行哦)目录下运行:./install.sh mphp 按提示 ...
- for miaomiao
package com.mytest.formiaomiao; import java.util.ArrayList; import java.util.List; import java.util. ...
- php 字典升序从小到大方法
/* 字典升序*/ function formatParaMap($paraMap) { $buff = ""; ksort($paraMap); foreach ($paraMa ...
- tab页签
<div class="fl" id="newsBox"> <div class="tab1 grayBar"> & ...
- 最新 海看java校招面经 (含整理过的面试题大全)
从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.海看等10家互联网公司的校招Offer,因为某些自身原因最终选择了海看.6.7月主要是做系统复习.项目复盘.LeetCode ...
- jquery换一批的写法
jquery换一批的写法 <pre> <img src="{$yuming}/images/3/huanyipi.png" alt="" cu ...
- AD域环境搭建
1.安装Windows server服务器 我安装的是Windows server 2012 Standard x64 下载地址:https://pan.baidu.com/s/1dZ_B5JIEit ...
- [转帖]删除一张大表时为什么undo占用空间接近原表两倍?
删除一张大表时为什么undo占用空间接近原表两倍? https://www.toutiao.com/i6736735016492990983/ 原创 波波说运维 2019-09-22 00:01:00 ...
- 国产龙芯服务器源码安装PostgreSQL数据库的方法
1. 公司最近有一些国产化项目的需求, 要求在国产CPU的服务器上面安装pg数据库等. 2.. 但是差查了下中标麒麟的官网,在龙芯MIPS的操作系统包源里面仅有 postgreSQL 9.2 版本的r ...
- Python习题002
作业1:判断某一个字符串是否是小数 def is_float(string): string1 = str(string) if string1.count('.') > 1: #检测字符串小数 ...