Flutter 入门与实战
在Flutter中,我们可以使用Stack
控件来实现图片的叠加。以下是一个简单的示例,展示如何在一张图片上叠加另一张小图片:
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: Stack(
children: <Widget>[
Image.network('https://example.com/big.jpg', fit: BoxFit.cover, height: 300.0, width: 300.0,),
Positioned(
right: 10.0,
bottom: 10.0,
child: Image.network('https://example.com/small.jpg', height: 50.0, width: 50.0,),
),
],
),
),
),
);
}
}
在这个例子中,我们使用了Stack
来叠加两个图片。big.jpg
是主要显示的图片,而small.jpg
是要叠加在big.jpg
上的小图片。Positioned
控件用来指定small.jpg
在big.jpg
上的位置。
请确保替换https://example.com/big.jpg
和https://example.com/small.jpg
为实际的图片链接。
评论已关闭