모바일 애플리케이션의 Azure-Flatter 소개

안녕하세요, 이 시리즈의 다른 블로그에 오신 것을 환영합니다.
이 시리즈는 모바일 응용 프로그램에서 아날로그 기술을 실현하는 데 관한 것이다.
Flatter mobile sdk를 사용하여 개발할 예정이므로 도입이 필요합니다.

무엇이 떨림입니까?

Flatter는 단일 코드 라이브러리에서 안드로이드, iOS, Linux, Mac, Windows, Google Fuchsia, 웹 응용 프로그램을 개발하는 소스 UI 소프트웨어 개발 키트입니다.
간단하죠?
재밌는 곳으로 가자!

떨림은 어떻게 일합니까?

다른 프레임워크에 비해 Flatter는 새로운 방식으로 구축되었고 그 작업 방식은 전통적인 응용 프로그램 프레임워크가 아닌 게임 엔진과 비슷하다.
아주 높은 차원에서 볼 때, 응용 프로그램은 작은 위젯 (이것을 표시하는 것) 으로 구성되어 있으며, 이 위젯들은 스카이 캔버스에 렌더링되어 플랫폼에 전송됩니다.플랫폼에 화보를 표시하고 필요에 따라 이벤트를 보냅니다.
응용 프로그램이 플랫폼에서 미리 실행될 것입니다.
곤혹스러웠어걱정 마.Flatter 응용 프로그램은 작은 위젯으로 구성되어 있음을 주의하십시오.

작은 부품?

작은 위젯은 기본 UI 요소입니다.
예를 좀 봅시다.
예1
프로그램에 텍스트를 추가하려고 합니다.Flatter에서 텍스트 위젯을 만들고 문자열을 다음과 같은 매개 변수로 전달합니다.

Text('Hello world')

예2
버튼을 추가하는 방법.떨림 속에는 많은 종류의 단추가 있는데, 편평한 단추가 그 중의 하나이다.FlatButtonWidget을 만듭니다.

FlatButton(  
     child: Text('LogIn'),  
     color: Colors.blueAccent,  
     textColor: Colors.white,  
     onPressed: () {},  
)

Flatutton 위젯의 매개 변수를 주의하십시오.텍스트 위젯으로 사용할 'child' 인자가 있습니다.이것은 우리가 다른 작은 위젯을 하위 위젯으로 다른 작은 위젯에 끼워 넣을 수 있다는 것을 의미한다.멋있죠?
추가할 수 있는 다른 매개 변수는 '색', '텍스트 색', '누르기' 단추입니다. 단추를 누르면 이 기능을 터치합니다.이러한 매개변수는 쉼표로 구분됩니다.

간단한 응용 프로그램 만들기

다음은 "Hello World"를 표시하는 Flitter 응용 프로그램 코드입니다.
첫걸음
이 코드는 모든 작은 위젯을 제공하는dart 패키지를 가져옵니다.

import 'package:flutter/material.dart';

두 번째 단계
기본 메서드를 작성합니다.이것은 응용 프로그램의 시작점입니다.

import 'package:flutter/material.dart';

void main() {

}

세 번째 단계

첫 번째 함수는runApp() 함수로 작은 위젯을 매개 변수로 받아들인다.main 메서드에 추가하고 Material App () 위젯으로 전송합니다.

Flatter는 많은 작은 위젯을 제공하여 재료 디자인에 맞는 응용 프로그램을 구축할 수 있도록 도와줍니다.

MaterialApp() 위젯은 모든 하위 부품에 이러한 재료 설계 구성 요소를 제공합니다.

이 작은 위젯은 여러 개의 파라미터를 받아들이지만, 이 예에서 우리는 두 개의 파라미터, 즉 타이틀과 홈을 계속 사용할 것이다
코드:

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      title: ,
      home: ,
      ),
    ),
  );
}

4단계
title 매개 변수는 기본적으로 프로그램의 이름인 문자열이 필요합니다.
홈 파라미터는 하위 파라미터와 더 잘 어울리는 작은 위젯이 필요합니다.
문자열을 제목으로 기입한 후 홈 매개 변수에 텍스트 위젯을 설치합니다.
생성된 코드는 다음과 같습니다.

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      title: 'MyApp',
      home: Text('Hello World'),
      ),
    ),
  );
}

다섯 번째 단계
애플리케이션을 실행하고 결과를 살펴보겠습니다.

사용자 인터페이스는...

... 엉터리이었어
우리가 무엇을 할 수 있는지 봅시다.
6단계

MaterialApp 위젯의 홈 매개 변수에 텍스트 앞에 Scaffold라는 위젯을 추가하고 위젯을 하위 단계로 추가합니다.

Scaffold 위젯은 appBar, body 및 기타 필요한 요소만 응용 프로그램에 추가합니다.

배치할 부품을 지정함으로써 작은 부품이 불필요한 위치에 자신을 배치하는 것을 방지할 수 있다(앞의 코드와 같다).

이 예에서 우리는 텍스트의 작은 위젯이 주체에 있기를 바란다.
이를 실제 작업에 추가합니다.

void main() {
  runApp(
    MaterialApp(
      title: 'MyApp',
      home: Scaffold(
        appBar: AppBar(),
        body: Text('Hello World'),
      ),
    ),
  );
}

이제 좀 괜찮아졌어요.
이제 너는 떨림이 어떻게 작동하는지 알게 되었다. 나는 그것을 거기에 두어 그 내용을 이해하게 할 것이다.
더 예쁘고 재미있는 프로그램을 만들기 위해 작은 위젯을 추가하는 방법을 계속 배워라.

결론

Flatter에서 응용 프로그램을 구축하는 것은 매우 쉽다.몇 줄 코드로 간단한 레이아웃을 만드는 방법을 볼 수 있습니다.
바이브레이션에 대한 자세한 내용은 공식 문서 웹 사이트를 참조하십시오.https://flutter.dev/docs
다음 단계: 떨림 환경을 설정합니다.