专业的编程技术博客社区

网站首页 > 博客文章 正文

Dart编程学习笔记09-从VScode自动生成项目的测试

baijin 2025-07-14 12:29:05 博客文章 3 ℃ 0 评论

使用VScode开发,效率很高,很好用IDE软件,功能强大,本项目采用的VScode版本如下:

---------------------------------------------------------------------------------------------------------------------

版本: 1.101.2 (user setup)

提交:
2901c5ac6db8a986a5666c3af51ff804d05af0d4

日期: 2025-06-24T20:27:15.391Z

Electron: 35.5.1

ElectronBuildId: 11727614

Chromium: 134.0.6998.205

Node.js: 22.15.1

V8: 13.4.114.21-electron.0

OS: Windows_NT x64 10.0.19041

-----------------------------------------------------------------------------------------------------------------------

一 代码

import 'package:flutter/material.dart';

void main() 
{
  runApp(const MyApp());
}

class MyApp extends StatelessWidget 
{
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
      ),
      home: const MyHomePage(title: '华澜能源平台'),
    );
  }
}

class MyHomePage extends StatefulWidget 
{
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>
 {
  int _counter = 0;

  void _incrementCounter() 
  {
    setState(() 
    {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold
    (
      appBar: AppBar
      (
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center
      (
        
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>
          [
            const Text('华澜能源(山东)有限公司'),
            Text
            (
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton
      (
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.donut_large),
      ), 
    );
  }
}

二 执行结果

三 总结

本例子实现了有状态的窗口的使用方法,编程代码逻辑清晰,是个很好例程,测试成功能大大提高学习flutter的效率。展示了flutter编程的一般方法!

这个自动生成的示例展示了 Flutter 的几个核心概念:

组件(Widget)树结构

有状态和无状态组件的区别

状态管理(setState)

Material Design 的基本组件使用

简单的 widget 测试

这个简单的计数器应用是学习 Flutter 的良好起点,你可以基于此逐步添加更复杂的功能。

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表