Flutter

반복

얼마나 반복할건지 반복횟수 정하기!
itemCount : ?

3번 반복하겠다는 뜻!

return ListView.builder(itemCount: 3,itemBuilder: (c,i) {
	return Column(
		children: [
        	Image.network('~~~'),
        	Text('좋아요100'),
            Text('글쓴이'),
            Text('글내용'),
        ]    
    )
}

@override, super 이런거 뭔데요

1. 우리가 커스텀 위젯 만들 때 StatefulWidget 이런거를 extends로 복사해서 만들어야한다고 했습니다.

복사한 StatefulWidget class를 보통 부모class 라고 부르는데

부모 class 안에 나랑 똑같은 이름을 가진 함수가 있을 경우

@override는 내걸 먼저 적용하라는 뜻입니다.

2. super.어쩌구는 부모 class 안에 있던 initState() 함수를 여기서 실행해달라는 뜻입니다.

혹여나 부모 위젯이 있고 그놈도 initState()를 해야하는 경우 그거 먼저 실행하라는 뜻일 뿐입니다.

3. 그냥 전부 플러터가 정상적으로 동작하기 위한

부가적인 문법일 뿐인데 평생 수정할 일이 없으니 그냥 무시하고 지나가도 됩니다.

이런 복잡한거 숨기고 보다 쉽게 쓸 수 있는 문법이 나오면 초보자들에게 좋겠군요

플러터 7.0 쯤 되면 그럴듯

import 'package:flutter/material.dart';
import 'package:flutter_instagram/style.dart' as style;
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() {
 runApp(
   MaterialApp(
     theme: style.theme,
     // 스타일을 모아놓을수있음
     home: MyApp(),
   ),
 );
}

var a = TextStyle(color: Colors.black);

class MyApp extends StatefulWidget {
 const MyApp({super.key});

 @override
 State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
 var tab = 0;
 var data = [];

 getData() async {
   var result = await http
       .get(Uri.parse('https://codingapple1.github.io/app/data.json'));
   var result2 = jsonDecode(result.body);
   // 이렇게하면 데이터가 담김
   setState(() {
     data = result2;
   });
 }

 @override
 void initState() {
   super.initState();
   getData();
 }

 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(
       actions: [
         IconButton(
           onPressed: () {},
           icon: Icon(
             Icons.add_box_outlined,
           ),
           iconSize: 30,
         )
       ],
       title: Text(
         'Instagram',
         style: a,
       ),
     ),
     body: [
       PostList(
         data: data,
       ),
       Text('샵페이지')
     ][tab],
     // body: [Text('홈페이지'), Text('샵페이지')][tab],
     bottomNavigationBar: BottomNavigationBar(
       showSelectedLabels: false,
       showUnselectedLabels: false,
       onTap: (i) {
         setState(() {
           tab = i;
         });
       },
       items: [
         BottomNavigationBarItem(icon: Icon(Icons.home_outlined), label: '홈'),
         BottomNavigationBarItem(
             icon: Icon(Icons.shopping_bag_outlined), label: '샵')
       ],
     ),
   );
 }
}

class PostList extends StatelessWidget {
 const PostList({this.data, Key? key}) : super(key: key);
 final data;

 @override
 Widget build(BuildContext context) {
   print(data);
   // 리스트 안비어있는지 물어보는 함수임
   if (data.isNotEmpty) {
     return ListView.builder(
       itemCount: data.length,
       itemBuilder: (context, index) {
         return Column(
           children: [
             Image.network(data[index]['image']),
             // Text(data[index]['likes']),
             Text(data[index]['user']),
             Text(data[index]['content']),
           ],
         );
       },
     );
   } else {
     return Text('로딩중임');
   }
 }
}