02.Flutter实战建立项目和编写入口文件

创建项目:

flutter create flutter_shop

创建完成之后呢,它会提示我们,

进入flutter_shop的目录,然后执行flutter run来运行项目

为什么起名flutter_shop用下划线的形式呢?因为在windows下不支持小驼峰和大驼峰的命名方式,官方推荐我们使用下划线的形式

做项目的时候,外层都套一个Container组件呢,这样会使你以后扩展会变的很容易

开始写入口文件main.dart

新建文件夹Pages,所有的UI页面都放在Pages页面下面

新建index_page.dart页面。官方推荐使用下划线的方式,这里我也使用下划线的方式去命名页面的文件。

在main.dart页面引入我们的index_page页面

查看效果:

代码;

import 'package:flutter/material.dart';
import './pages/index_page.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
child:MaterialApp(
title:'百姓生活+',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primaryColor: Colors.pink
),
home: IndexPage(),
)
);
}
}

main.dart

import 'package:flutter/material.dart';

class IndexPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('百兴生活+'),),
body: Center(
child: Text('百姓生活+'),
),
);
}
}

index_page.dart

Flutter实战视频-移动电商-02.Flutter实战建立项目和编写入口文件的更多相关文章

  1. Flutter移动电商实战 --(2)建立项目和编写入口文件

    1.创建项目 采用AndroidStudio构建本项目,FIle>New>New Flutter Project… 创建后的项目如下图所示: 我们着重需要注意一下几个文件夹,其他的暂时不用 ...

  2. 02-Flutter移动电商实战-建立项目和编写入口文件

    环境搭建请参考之前写的一篇文章:Flutter_初体验_创建第一个应用 1.创建项目 采用AndroidStudio构建本项目,FIle>New>New Flutter Project… ...

  3. Flutter实战视频-移动电商-15.首页_商品推荐模块编写

    15.首页_商品推荐模块编写 商品推荐,我们做成可以横向滚动的 分析: 上面是标题,下面是ListView,里面是一个Column, column分三层,第一是图片,第二是价格,第三是市场价格 小细节 ...

  4. Flutter实战视频-移动电商-17.首页_楼层组件的编写技巧

    17.首页_楼层组件的编写技巧 博客地址: https://jspang.com/post/FlutterShop.html#toc-b50 楼层的效果: 标题 stlessW快速生成: 接收一个St ...

  5. Flutter实战视频-移动电商-10.首页_FlutterSwiper轮播效果制作

    10.首页_FlutterSwiper轮播效果制作 博客地址: https://jspang.com/post/FlutterShop.html#toc-5c2 flutter_swiper http ...

  6. Flutter实战视频-移动电商-47.详细页_Flutter_html插件的使用

    47.详细页_Flutter_html插件的使用 详情里面是hemlt和图片组成的,但是flutter是不支持html的所以需要其他插件 flutter webview plugin:这个不太好用 f ...

  7. Flutter实战视频-移动电商-34.列表页_小BUG的修复

    34.列表页_小BUG的修复 当高粱酒的子类没有数据返回的时候就会报错. 解决接口空数据报错的问题 没有数据的时候,给用户一个友好的提示, 我们没有数据的时候还要告诉用户,提示一下他没有数据,在我们的 ...

  8. Flutter实战视频-移动电商-03.底部导航栏制作

    03.底部导航栏制作 material是谷歌退出的 还有另外的一种:cupertino是IOS的风格 我们底部的导航栏,静态的widget是不合适的,这垃圾我们用到动态的widget 这重新改成动态的 ...

  9. Flutter实战视频-移动电商-05.Dio基础_引入和简单的Get请求

    05.Dio基础_引入和简单的Get请求 博客地址: https://jspang.com/post/FlutterShop.html#toc-4c7 第三方的http请求库叫做Dio https:/ ...

随机推荐

  1. MEMS--微机电系统

    http://baike.baidu.com/view/95221.htm?fromtitle=MEMS&fromid=686299&type=search 微机电系统 编辑   您检 ...

  2. Numpy数组计算

    NumPy是高性能科学计算和数据分析的基础包.它是pandas等其他各种工具的基础. NumPy的主要功能 ndarray,一个多维数组结构,高效且节省空间 无需循环对整组数据进行快速运算的数学函数 ...

  3. class中的私有属性的访问

    在类中的私有属性设置: class Name(): __init__(self): self.__name = 'arnol'` 如何查看: 1,在类中定义一个方法: def getname(self ...

  4. Selenium学习(二)入门小例子

    1)打开百度页面 2)输入“hello” 3)点击百度一下按钮 from selenium import webdriver url = "http://" + "www ...

  5. FFmpeg编码详细流程

    FFmpeg在编码一个视频的时候的函数调用流程.为了保证结构清晰,其中仅列出了最关键的函数,剔除了其它不是特别重要的函数. 函数背景色 函数在图中以方框的形式表现出来.不同的背景色标志了该函数不同的作 ...

  6. git 下载与Linux源码安装最新版

    win: https://git-for-windows.github.io/ 或 https://git-scm.com/downloads   官网!   源码安装git Git 的工作需要调用  ...

  7. Struts MVC工作原理(转载)

    1.Struts MVC中Model 1 和Model 2简介 我们在开发Web应用时经常提到的一个概念是Model 1/Model 2,那么到底它是什么意思呢?其实它是对采用JSP技术构成Web应用 ...

  8. Mvc之Ajax上传图片

    MyAjaxForm下载地址,点击此处下载 视图部分: @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Lay ...

  9. 代码空间项目 -- alert窗口自定义

    function z_alert(msg){    //创建提示框盒子,设置盒子的css样式    var msgBox=document.createElement("div") ...

  10. Shell之内容匹配与格式输出

    对于大文本或者有些特定格式的文本,有时我们要查找特定内容或定位指定的区域,这样就需要内容匹配. 关于内容匹配,我们常使用的有几个命令: grep,支持正则,查找包含有匹配项的行. cut,提取指定的列 ...