iT邦幫忙

2022 iThome 鐵人賽

DAY 29
0
Software Development

初學軟體開發系列 第 29

Day29-實作介面

  • 分享至 

  • xImage
  •  

目標
這兩天的時間,我想做三個介面,啟動的介面、歡迎的介面以及登入的介面來做這三十天的結尾。

前言
在設計介面的時候,為了更有效率、更快速的撰寫,所以我參考的影片推薦使用藍湖這個簡體網站來縮短開發應用程式。

接下來要開始寫開發程式了,我們要新建一個專案,接下來的程式碼都會使用導入的方式來進行,因為當未來需要更新或是在檢查的時候,都會比較好。
所以我們在main的地方只會用導入的

import 'package:flutter/material.dart';

import 'splash.dart';
void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home:SplashPage(),
    );
  }
}

上面這是main.dart
下面是splash.dart

import 'package:flutter/material.dart';

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


  Widget view(BuildContext context){
    return const Center(
      child: Text('SplashPage'),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: view(context),
    );
  }
}

https://ithelp.ithome.com.tw/upload/images/20220929/20151918F4l9Si1fKV.png
這樣就導入成功

後面的就是跟之前寫過得差不多,加入一些顏色、還有Container容器來製作圖標。
這樣就完成了一個前置的框架。

總結
明天會把今天的最後內容輸出再上傳,顏色圖標這些。
那這三十天的成果,從零到有的一路上不好走,從一開始想研發應用程式的熱忱,到每一天都要再半夜12點前發表文章,這一個月的時間不但訓練我的文筆,也讓我更了解Flutter的用法


上一篇
Day28-輸入框(下)
下一篇
Day30-起始介面
系列文
初學軟體開發31
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言