flutter——Positioned组件,定位组件的设置

项目stackposition0222

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  //定义Stack()组件
  var stack_pos =Stack(
    children: [
      CircleAvatar(
        backgroundColor: Colors.brown,
        radius: 100.0,
      ),
      Positioned(
        //设置子元素
        child: Text("头部文字"),
        //设置定位,
        top: 10.0,
        left: 50.0,
      ),
      Positioned(
        //设置子元素
        child: Text("底部文字"),
        //设置定位,
        bottom: 10.0,
        right: 50.0,
      ),
    ],
  );
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      home: Scaffold(
        appBar: AppBar(title: Text("stackpositioned"),),
        body: Center(child: stack_pos,),
      ),
    );
  }
}

/**
 * Positioned()用在Stack()组件中
 * Positioned组件的属性
bottom: 距离层叠组件下边的距离
left:距离层叠组件左边的距离
top:距离层叠组件上边的距离
right:距离层叠组件右边的距离
width: 层叠定位组件的宽度
height: 层叠定位组件的高度
 */

 

你可能感兴趣的:(flutter)