flutter学习笔记一

//import 'package:flutter/material.dart';//导入包

/**
 * 第七节，图片列表
 */
// void main () => runApp(MyApp());
// class MyApp extends StatelessWidget{
//   @override
//   Widget build(BuildContext context ){
//       return MaterialApp(
//         title:'ListView widget',
//         home:Scaffold(
//           body:GridView(
//             gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
//               crossAxisCount: 3,//每行现实的个数
//               mainAxisSpacing: 2.0,//每两个横轴间隙
//               crossAxisSpacing: 2.0,//每两个纵轴间隙
//               childAspectRatio: 0.7//宽高笔直
//             ),
//             children: <Widget>[
//              new Image.network('http://img5.mtime.cn/mt/2018/10/22/104316.77318635_180X260X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/10/10/112514.30587089_180X260X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/11/13/093605.61422332_180X260X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/11/07/092515.55805319_180X260X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/11/21/090246.16772408_135X190X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/11/17/162028.94879602_135X190X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/11/19/165350.52237320_135X190X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/11/16/115256.24365160_180X260X4.jpg',fit: BoxFit.cover),
//              new Image.network('http://img5.mtime.cn/mt/2018/11/20/141608.71613590_135X190X4.jpg',fit: BoxFit.cover),
//             ],
//           )
//         ),
//       );
//   }
// }

/**
 * 第六节，动态列表的渲染
 */
// void main() => runApp(APP(
//   items:new List<String>.generate(1000, (i) => "item $i")
// ));
// class APP extends StatelessWidget{
//   final List<String> items;
//   APP({Key key,@required this.items}):super(key:key);
//   @override
//   Widget build(BuildContext context){
//     return MaterialApp(
//       title:'JsPang',
//       home:Scaffold(
//         appBar: new AppBar(title:new Text('ListView Widget')),
//         body:new ListView.builder(
//           itemCount: items.length,
//           itemBuilder: (context,index){
//             return new ListTile(
//               title:new Text('${items[index]}')
//             );
//           },
//         )
//       )
//     );
//   }
// }

// void main() => runApp(MyApp());//入口文件
/**
 * 第五节，组件化列表
 */
// class MyApp extends StatelessWidget{
//   @override //覆盖原来的方法 
//   Widget build(BuildContext context){
//     return MaterialApp(
//       title:'Text widget',
//       home:Scaffold(
//         appBar:new AppBar(title:new Text('ListView Widget')),//顶端导航栏
//         body:Center(
//           child:Container(
//             height: 200,
//             child: MyList(),//调用组件
//           )
//           )
/**
 * 第四节，列表容器
 */
// body:new ListView(
//   children: <Widget>[
//     new ListTile(
//       leading:new Icon(Icons.access_alarm),
//       title: new Text('access_alarm'),
//     ),
//     new ListTile(
//       leading:new Icon(Icons.add_call),
//       title: new Text('add_call'),
//     ),
//     new ListTile(
//       leading:new Icon(Icons.airline_seat_flat),
//       title: new Text('airline_seat_flat'),
//     )
//   ],
// )

/**
 * 第三节,图片的插入
 */
// body: Center(//下面代码要打开必须解开这一行，并把上方的body注释
// child: Container(
//   child: new Image.network(
//     'http://175.24.55.115/group1/M00/00/00/rBEAB15-55CAFSi-AACHuaXA5AY074_big.png',
//     fit: BoxFit.fill,//设置图片填充形式
//     // color:Colors.lightBlue, //图片混合颜色
//     // colorBlendMode: BlendMode.darken, //图片混合颜色
//     repeat: ImageRepeat.repeat,//图片平铺  repeatX repeatY
//   ),
//   width:200,
//   height:200,
// ),
/**
 * 第二节，padding marging，颜色过渡，边框
 */
//body: Center(
// child: Container(
//   child: new Text('Hello JSPang',style:TextStyle(fontSize: 40)),
//   alignment: Alignment.topLeft, //位置 bottomRight  centerLeft
//   width: 500,
//   height: 400,
//   // color: Colors.lightBlue,
//   padding: const EdgeInsets.fromLTRB(10, 20, 0, 0),
//   margin: const EdgeInsets.all(10),
//   decoration: new BoxDecoration(
//     gradient: const LinearGradient(colors: [Colors.lightBlue,Colors.greenAccent,Colors.purple]),//颜色过渡
//     border: Border.all(width: 5,color:Colors.red) //边框
//   ),
// ),
//)
/**
 * 第一节，溢出隐藏，颜色ARGB，下划线样式
 */
//body: Center(
// child: Text(
//   'Hellow Flutter!Hellow Flutter!Hellow Flutter!Hellow Flutter!Hellow Flutter!Hellow Flutter!Hellow Flutter!',
//   textAlign: TextAlign.left,
//   maxLines: 1,//行数
//   overflow: TextOverflow.ellipsis,//溢出隐藏
//   style: TextStyle(
//     fontSize: 25,
//     color: Color.fromARGB(255, 255, 125, 125),//颜色ARGB
//     decoration: TextDecoration.underline,//下划线
//     decorationStyle: TextDecorationStyle.solid,//下划线样式
//   ),
// ),
// ),
//)
// ),
// );
// }
// }

// class MyList extends StatelessWidget{
//   @override
//   Widget build(BuildContext context){
//     return ListView(
//       scrollDirection:Axis.horizontal,//横向    vertical竖向
//       children: <Widget>[
//         new Container(
//           width:180,
//           color:Colors.lightBlue,
//         ),
//         new Container(
//           width:180,
//           color:Colors.lightGreen,
//         ),
//         new Container(
//           width:180,
//           color:Colors.lime,
//         ),
//         new Container(
//           width:180,
//           color:Colors.pinkAccent,
//         ),
//       ],
//     );
//   }
// }