Flutter RotatedBox 旋转组件

在码农的世界里,优美的应用体验,来源于程序员对细节的处理以及自我要求的境界,年轻人也是忙忙碌碌的码农中一员,每天、每周,都会留下一些脚印,就是这些创作的内容,有一种执着,就是不知为什么,如果你迷茫,不妨来瞅瞅码农的轨迹。


RotatedBox 组件用来旋转其子 Widget 的功能 ,会影响子 Widget 实际的布局,基本使用代码如下:

RotatedBox(
   //旋转的倍数
   quarterTurns: 1,
   //旋转的子Widget
   child: Container(...),
)

参数 quarterTurns 用来配置旋转的倍数,正值为顺时针,负数为逆时针,然后实际旋转的角度为90的倍数,在 组件 layout 排版过程阶段起作用,也就是实际影响位置。

在这里插入图片描述

class DemoRotatedBoxPage extends StatefulWidget {
  @override
  _DemoRotatedBoxPageState createState() => _DemoRotatedBoxPageState();
}

class _DemoRotatedBoxPageState extends State<DemoRotatedBoxPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("RotatedBox 旋转"),
      ),
      backgroundColor: Colors.white,
      ///填充布局
      body: Container(
        padding: EdgeInsets.only(top: 100, left: 100, right: 100),
        child: Row(
          children: [buildRotate()],
        ),
      ),
    );
  }

  buildRotate() {
    return RotatedBox(
      //旋转的倍数
      quarterTurns: 1,
      //旋转的子Widget
      child: Container(
        child: Text(
          'Hello World!',
          style: TextStyle(
            color: Colors.white,
          ),
        ),
        color: Colors.blueGrey,
      ),
    );
  }
}

2 Transform.rotate 实现的旋转

在这里插入图片描述

class _DemoRotatedBoxPageState extends State<DemoRotatedBoxPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("RotatedBox 旋转"),
      ),
      backgroundColor: Colors.white,
      ///填充布局
      body: Container(
        padding: EdgeInsets.only(top: 100, left: 100, right: 100),
        child: Row(
          children: [buildTransform()],
        ),
      ),
    );
  }
  buildTransform() {
    return Transform.rotate(
      //旋转的弧度
      angle: pi/2,
      //旋转的子Widget
      child: Container(
        child: Text(
          'Hello World!',
          style: TextStyle(
            color: Colors.white,
          ),
        ),
        color: Colors.blueGrey,
      ),
    );
  }
 }

完毕

不局限于思维,不局限语言限制,才是编程的最高境界。

以小编的性格,肯定是要录制一套视频的,随后会上传

有兴趣 你可以关注一下 西瓜视频 — 早起的年轻人

在这里插入图片描述

早起的年轻人 CSDN认证博客专家 移动开发 项目管理 Java
只要用心去做,每一件事情还是有可能成功的,当然成功是没有界限的,只不过是达到自己心里的那个目标,公众号:我的大前端生涯,一个爱喝茶的程序员,通常会搞搞SpringBoot 、Herbinate、Mybatiys、Android、iOS、Flutter、Vue、小程序等.
已标记关键词 清除标记
相关推荐
©️2020 CSDN 皮肤主题: 代码科技 设计师:Amelia_0503 返回首页