你需要耐心觀看,不然沒有一顆學(xué)習(xí)的心,說得再詳細(xì)也是徒勞的
flutter對(duì)于Android來說相信很多同學(xué)都有許許多多的問題
比如啊
1.fultter 如何刷新頁(yè)面啊,
2.flutter 如何設(shè)置點(diǎn)擊事件啊
3.flutter 如何刷新listView
4.flutter 如何延遲、網(wǎng)絡(luò)刷新啊
等等 等等
這篇文章不討論底層星持,有些東西也不討論他是干啥的,
有這么一句話弹灭,只要你會(huì)用再去了解他的原理
ios的同學(xué)需要先學(xué)習(xí)一下dart語(yǔ)法
我就用Android的開始說了
Android 或 ios
Android 有個(gè)xml ,可以使用xml來先畫界面督暂,然后fingviewbyid來賦值,這是Android的思路
Android:java + xml來繪畫基礎(chǔ)頁(yè)面
然而flutter他是分為不同兩種的穷吮,如果感覺這種語(yǔ)法(畫頁(yè)面)很奇怪逻翁,那么建議先看一下drat語(yǔ)法
視圖樹(看不懂沒關(guān)系,只要會(huì)用就行) + dart 來繪畫頁(yè)面的
Android 頁(yè)面
可分為很多種布局捡鱼,相對(duì)八回,線性,絕對(duì)驾诈,等等
flutter對(duì)于初學(xué)者來說缠诅,目前你就只知道它有個(gè) 行和列布局(它也有很多種強(qiáng)大布局,目前只了解這2個(gè)就行)
flutter項(xiàng)目如下
標(biāo)注的是咋們基本用到的
Android:使我們最熟悉的東西
assets:資源文件夾
img:圖片存放目錄
ios:不鳥他
lib:存放dart代碼目錄
首先我們創(chuàng)建一個(gè)存放代碼的目錄
我創(chuàng)建了一個(gè)名叫"day_01的文件夾"
里邊放了一個(gè)叫Day01的dart文件
我們打開文件乍迄,發(fā)現(xiàn)里邊連個(gè)啥都沒有管引!直接有點(diǎn)懵!
很正常這個(gè)闯两,先不要管褥伴,java是以文件名為類的(可能不太正確,但這是規(guī)則漾狼,就像命名規(guī)則一樣)
而dart可以再一個(gè)文件中擁有很多很多的類(不說這么多了0.0重慢,感覺再說多了都木了..,記住就行)
----------------------------------開始代碼區(qū)域
簡(jiǎn)單地說,如果想深入了解的小伙伴逊躁,可以先去百度
StatelessWidget 與 StatefulWidget
StatelessWidget 為靜態(tài)頁(yè)面 不可刷新
StatefulWidget 為動(dòng)態(tài)頁(yè)面 可刷新UI頁(yè)面
這么說吧 Android 就把它理解為(StatelessWidget 或 StatefulWidget)Activity
ios 就把他理解為(StatelessWidget 或 StatefulWidget)控制器
第一步[格式是死的記住就行]
在Android Studio 中輸入
不想寫可在Android Studio 中輸入快捷鍵: stful 回車就能自動(dòng)生成
//導(dǎo)包為material.dart
import 'package:flutter/material.dart';
//創(chuàng)建一個(gè)Day01 的類
class Day01 extends StatefulWidget {
@override
_Day01State createState() => _Day01State();
}
//返回視圖樹
class _Day01State extends State<Day01> {
@override
Widget build(BuildContext context) {
return Container();
}
}
小組件,現(xiàn)在就開始要死記硬背小組件了
-
---------------------------小組件
-
主題: MaterialApp 記憶法M'y'APP 根據(jù)提示就能找出來了
腳手架 :Scaffold 記憶法 S ca,自行腦補(bǔ)
橫向:Row 記憶法:它與Rom比較像似踱,吧m倒過來就行了
豎向: Column 記憶法:它與Color(前邊,加上提示就知道了)比較像稽煤,所以記住:Col提示就出來了
文本: Text 記憶法:這個(gè)就不用說了吧核芽?
-
---------------------------小組件
-
就用這4個(gè)組件我們來看看豎向和橫向的排列
啥,你說MaterialApp 是干啥的念脯,怎么用,啥都不知道就往上搞弯淘?
MaterialApp 類似于一個(gè)可以設(shè)置APP的主題绿店,你不想要也行,但是不推薦
Scaffold(腳手架) 的作用
他可以給這幾個(gè)地方放view
一般我們用boy
來繼續(xù)我們說的橫向豎向排列
加入主入口
void main() =>runApp(Day01());
它相當(dāng)于
void main(){
runApp(Day01());
}
全部代碼
import 'package:flutter/material.dart';
void main() =>runApp(Day01());
class Day01 extends StatefulWidget {
@override
_Day01State createState() => _Day01State();
}
class _Day01State extends State<Day01> {
@override
Widget build(BuildContext context) {
return MaterialApp(
//------------------------------------------新增
home: Scaffold(
body: Column(
children: <Widget>[
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
Text("你好"),
],
)
,
),
);
}
}
效果圖:
------------未完待續(xù)