Flutter开发(二)：Flutter入门基础

注释：下面 RV 代表 React Native，下面命令行都是在终端输入。

创建 Flutter 项目

//创建rv项目
create-react-native-app <projectname>
//创建flutter项目
flutter create <projectname>

        或者打开 AndroidStudio ，选择 File - New - New Flutter Project...

运行 Flutter 项目

//运行rv项目
react-native run-ios
react-native run-android
//运行flutter项目
flutter run -d 'iPhone X'

        或者打开 AndroidStudio ，点击 Run 按钮运行。

如何导入 Widget

//下面代码在项目中添加
//rv
import React from "react"
import{ StyleSheet, Text, View } from "react-native";//导入系统组件
import NavigationBar from '.../commin/NavigationBar';//导入自己组件
//flutter
import 'package:flutter/material.dart';//导入系统widget库
import 'package:flutter/cupertino.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter/my_widgets.dart';//导入个人widget库

实现 HelloWorld

//rv
import React from "react";
import { StyleSheet, Text, View } from "react-native";

export default calss App extends React.Component{
    ender(){
        return(
            <View style={styles.container}>
                <Text>Hello world!</Text>    </View>);
    }
}

const styles = StyleSheet.create({
    container:{
        flex: 1,
        backgroundColor:"#fff",
        alignItems: "center",
        justifyContent: "center"
    }
});

//flutter
import 'package:flutter/material.dart';

void main(){
    runApp(
        Center(
            child: Text(
                'Hello,world!',
                textDirection: TextDirection.ltr,
            ),
        ),
    );
}