美文网首页Flutter
Flutter小技巧

Flutter小技巧

作者: loongod | 来源:发表于2019-04-29 14:57 被阅读0次

    1. 获取状态栏高度

    import 'dart:ui';
    MediaQueryData.fromWindow(window).padding.top
    

    2. 设置AppBar的高度

    Scaffold( 
            appBar: PreferredSize(
            child: AppBar(
            ),
            preferredSize: Size.fromHeight(screenSize.height * 0.07))
    );
    

    3. 系统默认的AppBar、TabBar高度

    Dart Packages/flutter/src/material/constans.dart

    /// The height of the toolbar component of the [AppBar].
    const double kToolbarHeight = 56.0;
    
    /// The height of the bottom navigation bar.
    const double kBottomNavigationBarHeight = 56.0;
    
    /// The height of a tab bar containing text.
    const double kTextTabBarHeight = 48.0;
    
    /// The amount of time theme change animations should last.
    const Duration kThemeChangeDuration = Duration(milliseconds: 200);
    
    /// The radius of a circular material ink response in logical pixels.
    const double kRadialReactionRadius = 20.0;
    
    /// The amount of time a circular material ink response should take to expand to its full size.
    const Duration kRadialReactionDuration = Duration(milliseconds: 100);
    
    /// The value of the alpha channel to use when drawing a circular material ink response.
    const int kRadialReactionAlpha = 0x1F;
    
    /// The duration of the horizontal scroll animation that occurs when a tab is tapped.
    const Duration kTabScrollDuration = Duration(milliseconds: 300);
    
    /// The horizontal padding included by [Tab]s.
    const EdgeInsets kTabLabelPadding = EdgeInsets.symmetric(horizontal: 16.0);
    
    /// The padding added around material list items.
    const EdgeInsets kMaterialListPadding = EdgeInsets.symmetric(vertical: 8.0);
    

    4. 获取当前时间戳

    /** 返回当前时间戳 */
      static int currentTimeMillis() {
        return new DateTime.now().millisecondsSinceEpoch;
      }
    

    5. 获取控件大小和相对屏幕位置

    1.首先先需要对控件进行渲染
    初始化GlobalKey :GlobalKey anchorKey = GlobalKey();
    
    2.在需要测量的控件的下面添加key:
    child: Text("点击弹出悬浮窗",
      style: TextStyle(fontSize: 20),
      key: anchorKey
    ),
    
    3.获取控件的坐标:
    RenderBox renderBox = anchorKey.currentContext.findRenderObject();
    var offset =  renderBox.localToGlobal(Offset.zero);
    
    控件的横坐标:offset.dx
    控件的纵坐标:offset.dy
    
    如果想获得控件正下方的坐标:
     RenderBox renderBox = anchorKey.currentContext.findRenderObject();
     var offset =  renderBox.localToGlobal(Offset(0.0, renderBox.size.height));
    
       控件下方的横坐标:offset.dx
       控件下方的纵坐标:offset.dy
    
    4.获取控件的大小:
    RenderBox renderBox = anchorKey.currentContext.findRenderObject();
    final size = renderBox.size;
    

    相关文章

      网友评论

        本文标题:Flutter小技巧

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