Wilkyway

1. 생성방법

flutter build apk --release --target-platform=android-arm64

2. no sound null safety 추가하기

flutter build apk --release --no-sound-null-safety --target-platform=android-arm64

3. 위치

project folder > build > app > outputs > flutter-apk

우선 색상코드를 바꿔줍니다.

color: Colors.orange, -->  color: Color(0xFFF99231),

Center위젯을 Colum위젯으로 바꾸고, CircularProgressIndicator 반영하기

이미지를 높이방향으로 가운데 정렬하기

이미지의 사이즈를 200px로 줄이고 가운데 정렬하기

프로그레스 이미지를 흰색으로 변경하기

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          decoration: BoxDecoration(
            color: Color(0xFFF99231),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Image.asset(
                    'assets/logo.png',
                    width: 200,
                  ),
                  CircularProgressIndicator(
                    valueColor: AlwaysStoppedAnimation(
                      Colors.white,
                    )
                  ),
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}

코드팩토리의 플러터 프로그래밍 -  Splash Screen

우여곡절 끝에 플러터 설치를 마치고, 혼자 공부하다 잘 안되어 책을 구매하게 되었습니다.

기본 문법은 대충 보고, 첫번째 예제부터 따라해보기로 했습니다.

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          decoration: BoxDecoration(
            color: Colors.orange,
          ),
          child: Center(
            child: Text('Splash Screen'),
          ),
        ),
      ),
    );
  }
}

화면이 잘 나오네요. Dart라는게 좀 생소하긴 합니다. 첨이라 어렵네요.

다음으로 이미지를 넣어봅니다. 

assets라는 폴더를 만들고, logo.png를 해당 폴더에 넣어줍니다. (github link)

아래쪽의 pubspec.yaml 파일을 수정하고..

상단의 pub get을 눌러줍니다. 그래야 해당 폴더가 asset으로 인식이 됩니다.

그리고 코드에 텍스트 표시부분을 이미지가 표시되도록 바꿔줍니다.

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          decoration: BoxDecoration(
            color: Colors.orange,
          ),
          child: Center(
            child: Image.asset( //교체
              'assets/logo.png' //교체
            ),
          ),
        ),
      ),
    );
  }
}

성공적으로 나오네요^^

Flutter를 한번 해보려고 합니다. 그런데 Flutter Doctor라는걸 실행하니까, Visual Studio가 안깔려있다네요???? 모바일 개발할건데 웬 Visual Studio? ㅠㅠ 그래서 포기할까도 생각해봤지만 여기저기 찾아다니다가 알아냈습니다.

Windows에서 모바일만 개발할 계획인데 굳이 무거운  Visual Studio를 깔고싶지 않다면 아래와 같이 실행하여 설정을 변경해 줄 수 있습니다. 그러면 Visual Studio 관련 부분이 사라집니다.^^

flutter config --no-enable-windows-desktop

flutter doctor

(ps) Unable to find bundled Java version 에러

C:\Program Files\Android\Android Studio

경로로 가셔서 jbr 폴더의 내용을 jre 폴더에 붙여넣기 (안드로이드 스튜디오 버그)

(ps) Windows Version (Unable to confirm if installed Windows version is 10 or greater) 에러

C:\> flutter upgrade

C:\> flutter channel master

C:\> flutter doctor -v