스토어 앱 만들기

 

yaml 파일에 assets 경로 설정
이미지 파일 인식을 위해 자원 폴더 위치 설정 후 pub get 클릭하여 설정 적용

main.dart

import 'package:flutter/material.dart';

// 코드의 진입점
void main() {
  // runApp 함수는 괄호 안에 들어가는 위젯을 루트 위젯으로 만들어준다.
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // const를 사용하는 것이 성능상 좋다.
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    // MaterialApp 호출 (내부에 편리한 기능들이 많이 있다)
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: StorePage(),
    );
  }
} // end of MyApp

//stl 자동 완성해보기
class StorePage extends StatelessWidget {
  const StorePage({super.key});

  @override
  Widget build(BuildContext context) {
    // 시각적 레이아웃 틀을 잡아주는 컴포넌트 위젯
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: [
            Padding(
              padding: const EdgeInsets.all(25.0),
              child: Row(
                children: [
                  Text('Woman', style: TextStyle(fontWeight: FontWeight.bold)),
                  Spacer(),
                  Text('Kids', style: TextStyle(fontWeight: FontWeight.bold)),
                  Spacer(),
                  Text('Shoes', style: TextStyle(fontWeight: FontWeight.bold)),
                  Spacer(),
                  Text('Bag', style: TextStyle(fontWeight: FontWeight.bold)),
                ],
              ),
            ),
            Expanded(
                child:
                    Image.asset("assets/images/bag.jpeg", fit: BoxFit.cover)),
            const SizedBox(
              height: 2,
            ),
            Expanded(
                child:
                    Image.asset("assets/images/cloth.jpeg", fit: BoxFit.cover)),
          ],
        ),
      ),
    );
  }
}