如何将图像置于图像内部抖动 [英] how can put image inside the image in flutter
本文介绍了如何将图像置于图像内部抖动的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
https://i.stack.imgur.com/w5mLQ.png
Like what we see a small circular image inside the big picture . And how to arrange the text as in the picture
https://i.stack.imgur.com/w5mLQ.png
解决方案
Widget build(BuildContext context) {
return new Container(
height: 150.0,
margin: new EdgeInsets.all(10.0),
decoration: new BoxDecoration(borderRadius: new BorderRadius.all(new Radius.circular(10.0)),
gradient: new LinearGradient(colors: [Colors.yellow[700], Colors.redAccent],
begin: Alignment.centerLeft, end: Alignment.centerRight, tileMode: TileMode.clamp)),
child: new Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
new Padding(padding: new EdgeInsets.only(left: 10.0, right: 10.0),
child: new CircleAvatar(radius: 35.0, backgroundImage: NetworkImage('https://wallpapercave.com/wp/wp2365076.jpg'),)
),
new Expanded(child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Text('New York', style: new TextStyle(fontSize: 20.0, color: Colors.white70, fontWeight: FontWeight.bold),),
new SizedBox(height: 8.0,),
new Text('Sunny', style: new TextStyle(fontSize: 12.0, color: Colors.white70),),
new SizedBox(height: 10.0,),
new Row(children: <Widget>[
new Column(children: <Widget>[
new Text('2342', style: new TextStyle(fontSize: 12.0, color: Colors.white)),
new Text('Popularity', style: new TextStyle(fontSize: 10.0, color: Colors.white)),
],),
new Column(children: <Widget>[
new Text('2342', style: new TextStyle(fontSize: 12.0, color: Colors.white)),
new Text('Like', style: new TextStyle(fontSize: 10.0, color: Colors.white)),
],),
new Column(children: <Widget>[
new Text('2342', style: new TextStyle(fontSize: 12.0, color: Colors.white)),
new Text('Followed', style: new TextStyle(fontSize: 10.0, color: Colors.white)),
],)
],)
],)),
new Padding(padding: new EdgeInsets.only(left: 10.0, right: 10.0),
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text('12°', style: new TextStyle(fontSize: 30.0, color: Colors.white70),),
new Text('Ranking', style: new TextStyle(fontSize: 14.0, color: Colors.white70),),
],))
],),
);
}
这篇关于如何将图像置于图像内部抖动的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文