GetX学习02 高级API

1,737 阅读3分钟

这是我参与8月更文挑战的第2天,活动详情查看:8月更文挑战

今天我们来学习一下GetX都提供了哪些小工具, 又做了哪些优化

  1. 路由相关的API都在路由篇讲吧
// 给出当前页面的args。
    Get.arguments

//    给出以前的路由名称
    Get.previousRoute

// 给出要访问的原始路由,例如,rawRoute.isFirst()
    Get.rawRoute

// 允许从GetObserver访问Rounting API。
    Get.routing

// 检查 snackbar 是否打开
    Get.isSnackbarOpen

// 检查 dialog 是否打开
    Get.isDialogOpen

// 检查 bottomsheet 是否打开
    Get.isBottomSheetOpen

// 删除一个路由。
    Get.removeRoute()

//反复返回,直到表达式返回真。
    Get.until()

// 转到下一条路由,并删除所有之前的路由,直到表达式返回true。
    Get.offUntil()

// 转到下一个命名的路由,并删除所有之前的路由,直到表达式返回true。
    Get.offNamedUntil()
  1. 平台判断
//检查应用程序在哪个平台上运行。
GetPlatform.isAndroid
GetPlatform.isIOS
GetPlatform.isMacOS
GetPlatform.isWindows
GetPlatform.isLinux
GetPlatform.isFuchsia

//检查设备类型
GetPlatform.isMobile
GetPlatform.isDesktop
//所有平台都是独立支持web的!
//你可以知道你是否在浏览器内运行。
//在Windows、iOS、OSX、Android等系统上。
GetPlatform.isWeb

具体代码在utils下的platform中 有个之前没了解过的知识点

import 'platform_web.dart' if (dart.library.io) 'platform_io.dart';

import中带有一个if判断,这是个条件导入,判断如果包含dart.library.io就导入platform_io.dart

5a0116c27adb0335e6859b4a9c98f880.png

移动端平台的判断是在platform_io.dart调用flutter的platform判断

web平台的判断则是在platform_web.dart中调用flutter中的dart:html通过appVersion判断

class GeneralPlatform {
  static bool get isWeb => true;

  static bool get isMacOS =>
      _navigator.appVersion.contains('Mac OS') && !GeneralPlatform.isIOS;

  static bool get isWindows => _navigator.appVersion.contains('Win');

  static bool get isLinux =>
      (_navigator.appVersion.contains('Linux') ||
          _navigator.appVersion.contains('x11')) &&
      !isAndroid;

  // @check https://developer.chrome.com/multidevice/user-agent
  static bool get isAndroid => _navigator.appVersion.contains('Android ');

  static bool get isIOS {
    // maxTouchPoints is needed to separate iPad iOS13 vs new MacOS
    return GetUtils.hasMatch(_navigator.platform, r'/iPad|iPhone|iPod/') ||
        (_navigator.platform == 'MacIntel' && _navigator.maxTouchPoints! > 1);
  }

  static bool get isFuchsia => false;

  static bool get isDesktop => isMacOS || isWindows || isLinux;
}
  1. 高度宽度
// 相当于.MediaQuery.of(context).size.height,
//但不可改变。
Get.height
Get.width

这两个都是对flutter代码的简单封装,调用ui.window拿到的

  1. context context在flutter中还是比较重要的,很多地方都要用到,而GetX提供了一个全局的context

key的创建:

class GetMaterialController extends GetxController {

  ...

  var _key = GlobalKey<NavigatorState>(debugLabel: 'Key Created by default');

  GlobalKey<NavigatorState> get key => _key;

  GlobalKey<NavigatorState>? addKey(GlobalKey<NavigatorState> newKey) {
    _key = newKey;
    return key;
  }

  Map<dynamic, GlobalKey<NavigatorState>> keys = {};

  ...
}

也可以在GetMaterialApp中的navigatorKey进行赋值

剩下的就是一些对context的一些扩展在context_extensions.dart

// 如果你需要一个可改变的高度/宽度(如桌面或浏览器窗口可以缩放),你将需要使用上下文。
context.width
context.height

// 让您可以定义一半的页面、三分之一的页面等。
// 对响应式应用很有用。
// 参数: dividedBy (double) 可选 - 默认值:1
// 参数: reducedBy (double) 可选 - 默认值:0。
context.heightTransformer()
context.widthTransformer()

/// 类似于 MediaQuery.of(context).size。
context.mediaQuerySize()

/// 类似于 MediaQuery.of(context).padding。
context.mediaQueryPadding()

/// 类似于 MediaQuery.of(context).viewPadding。
context.mediaQueryViewPadding()

/// 类似于 MediaQuery.of(context).viewInsets。
context.mediaQueryViewInsets()

/// 类似于 MediaQuery.of(context).orientation;
context.orientation()

///检查设备是否处于横向模式
context.isLandscape()

///检查设备是否处于纵向模式。
context.isPortrait()

///类似于MediaQuery.of(context).devicePixelRatio。
context.devicePixelRatio()

///类似于MediaQuery.of(context).textScaleFactor。
context.textScaleFactor()

///查询设备最短边。
context.mediaQueryShortestSide()

///如果宽度大于800,则为真。
context.showNavbar()

///如果最短边小于600p,则为真。
context.isPhone()

///如果最短边大于600p,则为真。
context.isSmallTablet()

///如果最短边大于720p,则为真。
context.isLargeTablet()

///如果当前设备是平板电脑,则为真
context.isTablet()

///根据页面大小返回一个值<T>。
///可以给值为:
///watch:如果最短边小于300
///mobile:如果最短边小于600
///tablet:如果最短边(shortestSide)小于1200
///desktop:如果宽度大于1200
context.responsiveValue<T>()

今天的学习就到这了