添加链接
link之家
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接
首页 > 软件编程 > Android > Android Studio生成Flutter模板

Android Studio生成 Flutter 模板代码技巧详解

作者:沧海一树

这篇文章主要为大家介绍了Android Studio生成 Flutter 模板代码技巧详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

在开发 Flutter 时,常常需要创建新的页面或新的 Widget,每次都重新手写总是很麻烦,这篇文章介绍一些减少手写样板代码的方式。

笔者使用的是 Android Studio,所以这里的技巧都是在 AS 中使用的。

Android Studio 的 Flutter 插件提供了一些在代码编辑区域的快捷输入,根据这些输入可以快速生成模板代码。最常用的快捷输入是 stless stful

stless 表示生成一个 Stateless 的 Widget。

// | 表示多行光标,可以输入类名
class | extends StatelessWidget {
  const |({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Container();

stful 表示生成一个 Stateful 的 Widget。

// | 表示多行光标,可以输入类名
class | extends StatefulWidget {
  const |({Key? key}) : super(key: key);
  @override
  _|State createState() => _State();
class _|State extends State<> {
  @override
  Widget build(BuildContext context) {
    return Container();

一个小缺点:不能自动生成 import,需要额外手动 import material 库。

AS 文件模板

Android Studio 提供了强大的代码和文件模板功能,我们可以使用它来创建 Flutter 的模板。

如何创建模板

在文件目录处,右键选择 New,选择 Edit File Templates...,会出现一个编辑模板的弹窗。

在弹窗中,点击下图红框中的 + 号,就可以创建一个文件模板了,只需要将模板代码输入到右侧的编辑区域即可。

代码模板示例

StatelessWidget 模板

#set( $nameparts = $NAME.split("_"))
#set( $namepart = '')
#set( $classname = '')
#foreach( $namepart in $nameparts )
    #set( $classname = $classname + $namepart.substring(0, 1).toUpperCase() + $namepart.substring(1))
import 'package:flutter/material.dart';
class $classname extends StatelessWidget {
    // TODO: add state variables, methods and constructor params
    $classname();
    @override
    Widget build(BuildContext context) {
        // TODO: add widget build method
        return null;

StatefulWidget 模板

#set( $nameparts = $NAME.split("_"))
#set( $namepart = '')
#set( $classname = '')
#foreach( $namepart in $nameparts )
    #set( $classname = $classname + $namepart.substring(0, 1).toUpperCase() + $namepart.substring(1))
import 'package:flutter/material.dart';
class $classname extends StatefulWidget {
    @override
    _${classname}State createState() => new _${classname}State();
class _${classname}State extends State<$classname> {
    // TODO: add state variables and methods
    @override
    Widget build(BuildContext context) {
        // TODO: add widget build method
        return null;

这里最值得注意的是 import 语句前的的一段代码,它是把小写下划线格式的 dart 文件名,转换成大驼峰格式的 dart 类名。比如 hello_world_widget.dart 就会变成 HelloWorldWidget

这样就可以模仿着写一个自己的模板了,比如笔者针对 Stateless 的 Scaffold 的页面制作了一个模板:

#set( $nameparts = $NAME.split("_"))
#set( $namepart = '')
#set( $classname = '')
#foreach( $namepart in $nameparts )
    #set( $classname = $classname + $namepart.substring(0, 1).toUpperCase() + $namepart.substring(1))
import 'package:flutter/material.dart';
class $classname extends StatelessWidget {
  const $classname({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("$classname"),
      body: Container(),

如何使用模板

在文件目录处,右键选择 New,选择自己创建的模板(如下图),就会弹出一个弹窗,输入 dart 文件名即可生成模板代码文件。

How to make templates in Android Studio

以上就是Android Studio生成 Flutter 模板代码技巧详解的详细内容,更多关于Android Studio生成Flutter模板的资料请关注脚本之家其它相关文章!

您可能感兴趣的文章:
  • Flutter生命周期超详细讲解
    Flutter生命周期超详细讲解
    2023-04-04
  • 源码分析Android LayoutInflater的使用
    源码分析Android LayoutInflater的使用
    2023-04-04
  • Android补间动画的实现示例
    Android补间动画的实现示例
    2023-04-04
  • Android那两个你碰不到但是很重要的类之ActivityThread
    Android那两个你碰不到但是很重要的类之ActivityThread
    2023-05-05
  • 详解Android官方架构中UseCase
    详解Android官方架构中UseCase
    2023-05-05
  • Android SeekBar在刷新使用中需要注意的问题
    Android SeekBar在刷新使用中需要注意的问题
    2023-05-05
  • Android依赖注入框架Dagger2的使用方法
    Android依赖注入框架Dagger2的使用方法
    2023-05-05
  • 使用Jetpack Compose实现翻转卡片效果流程详解
    使用Jetpack Compose实现翻转卡片效果流程详解
    2023-05-05
  • 美国设下计谋,用娘炮文化重塑日本,已影响至中国
    美国设下计谋,用娘炮文化重塑日本,已影响至中国
    2021-11-19
  • 时空伴随者是什么意思?时空伴随者介绍
    时空伴随者是什么意思?时空伴随者介绍
    2021-11-09
  • 工信部称网盘企业免费用户最低速率应满足基本下载需求,天翼云盘回应:坚决支持,始终
    工信部称网盘企业免费用户最低速率应满足基本下载需求,天翼云盘回应:坚决支持,始终
    2021-11-05
  • 2022年放假安排出炉:五一连休5天 2022年所有节日一览表
    2022年放假安排出炉:五一连休5天 2022年所有节日一览表
    2021-10-26
  • 电脑版 - 返回首页

    2006-2024 脚本之家 JB51.Net , All Rights Reserved.
    苏ICP备14036222号