Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- Flutter Tutorial
- Row Widget
- Row
- Flutter 앱 배포
- Scaffold
- FutureBuilder
- CrossAxisAlignment
- Flutter 예제
- Snackbar
- Flutter Example
- WillPopScope
- Column Widget
- flutter
- ListView.builder
- Hello World
- listview
- ListTile
- 반석천
- navigator
- Load Image
- HTTP
- InkWell
- AppBar
- node.js
- sqlite
- Image.network
- Flutter 강좌
- Networking
- Cached Image
- MainAxisAlignment
Archives
- Today
- Total
꿈꾸는 시스템 디자이너
Flutter Example - ListView | Horizontal ListView 본문
import 'package:flutter/material.dart';
class ListViewHorizontal extends StatelessWidget {
List<Container> items;
ListViewHorizontal() {
items = List<Container>.generate(100, (index) {
return boxItem(index);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("ListView - Horizontal")),
body: Container(
height: 100,
child: ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: items.length,
itemBuilder: (context, index) {
return items[index];
},
),
),
);
}
boxItem(int index) {
return Container(
height: 100,
width: 100,
decoration: BoxDecoration(
color: (index % 3 == 0)
? Colors.red
: (index % 3 == 1) ? Colors.blue : Colors.orange),
alignment: Alignment(0, 0),
child: Text(
"Item $index",
style: TextStyle(color: Colors.white),
),
);
}
}
▶ Go to Table of Contents | 강의 목차로 이동
※ This example is also available in the Flutter Code Examples app. | 본 예제는 Flutter Code Examples 앱에서도 제공됩니다.
'Tutorial > Flutter with App' 카테고리의 다른 글
Flutter Example - ListView | Handle Items | Insert & remove items (2) | 2019.09.30 |
---|---|
Flutter Example - GridView Widget (0) | 2019.09.27 |
Flutter Example - ListView | ListView with diffrent types of items (0) | 2019.09.27 |
Flutter Example - ListView | Create ListView with builder (2) | 2019.09.27 |
Flutter Example - ListView | basic (0) | 2019.09.27 |
Comments