美文网首页Flutter圈子Flutter中文社区Flutter
Flutter:尝试撸一个具有惯性跟阻力的旋转控件或用传感器控制

Flutter:尝试撸一个具有惯性跟阻力的旋转控件或用传感器控制

作者: Nightmare_梦魇兽 | 来源:发表于2019-01-13 21:25 被阅读85次

来源

一直都想写一个可以转动的Widget,并且可以近似的模拟生活中的惯性跟阻力,因为设计到一些数学公式,作者还去请教了我的高中老师,最后学了点传感器,就直接外加个可选择传感器控制了

效果

1231312.gif

实现方法

逻辑部分比较复杂,作者写了好几天,最后干脆直接写了一个Dart Packages上传到了Pub,里面有大量的注释,代码还很不简化体谅一下,欢迎体验

将其添加到包的pubspec.yaml文件中:

dependencies:
  rotated_view: ^1.0.1

然后导入包

import 'package:rotated_view/rotated_view.dart';

代码部分

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:rotated_view/rotated_view.dart';

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

class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
StreamSubscription _subscription;

@override
void initState() {
  super.initState();
}

@override
void dispose() {
  if (_subscription != null) {
    _subscription.cancel();
  }
  super.dispose();
}

@override
Widget build(BuildContext context) {
  return MaterialApp(
    color: Colors.black,
    home: Scaffold(
      body: Center(
          child: Column(
        children: <Widget>[
          Padding(
            padding: EdgeInsets.fromLTRB(0, 100, 0, 0),
          ),
          Container(
            width: 400,
            height: 400,
            child: RotatedView(
              child: Image.asset("images/launcher_background.png"),
              usesensor: false,
              issame: false,
              haveinertia: true,
            ),
          ),
          Text(""),
        ],
      )),
    ),
  );
}
}

我的FlutterGithub

相关文章

  • Flutter:尝试撸一个具有惯性跟阻力的旋转控件或用传感器控制

    来源 一直都想写一个可以转动的Widget,并且可以近似的模拟生活中的惯性跟阻力,因为设计到一些数学公式,作者还去...

  • 生涯感悟|惯性阻力

    每个人成长的路上都会遇到“惯性阻力”,它会让我们在徒劳无功的老路上回旋。 因此,我们需要切断惯性阻力,尝试未做过之...

  • iOS传感器:实现一个随屏幕旋转的图片

    iOS传感器:实现一个随屏幕旋转的图片 iOS传感器:实现一个随屏幕旋转的图片

  • flutter以中心旋转控件

    其实就实现这么一个旋转动画,一开始想到的是用AnimatedContainer的transform属性来实现这个动...

  • Flutter Widget简介

    首先,在Flutter中几乎所有的对象都是一个Widget。跟原生开发中的“控件”不同,Flutter中的Widg...

  • 2018-12-07

    汽车行驶阻力,滚动阻力,空气阻力,坡度阻力,惯性阻力

  • flutter widget 控件

    flutter widget控件 学习路径 1.widget 在flutter中UI控件就是wiget 一个wig...

  • 扇形按钮

    自己封装的一个小控件 跟大家分享下 github 地址 使用方法 1将Cls/class中的文件拉取到工程中 或用...

  • 珍惜眼前人

    人就像一个陀螺,擦肩而过的人越多,转得越洒脱。就怕之后,无法控制旋转的惯性,遇见了谁,又是习惯性的错过。 ...

  • Flutter--常用的布局控件

    Flutter的控件 Flutter提供的控件非常多,都可以在Flutter Widget 索引中进行查看。 对于...

网友评论

    本文标题:Flutter:尝试撸一个具有惯性跟阻力的旋转控件或用传感器控制

    本文链接:https://www.haomeiwen.com/subject/rualdqtx.html