Sepa que es Flutter

Flutter es el marco de interfaz de usuario móvil de Google, que puede crear rápidamente interfaces de usuario nativas de alta calidad en iOS y Android. Flutter puede trabajar con código existente. En todo el mundo, cada vez más desarrolladores y organizaciones utilizan Flutter, y Flutter es completamente gratuito y de código abierto.

Aprenda un marco, como de costumbre , mire el documento: sitio web de Flutter Chinese / sitio web oficial de Flutter English

Ecología de aleteo

dirección de github: https://github.com/Solido/awesome-flutter
escaparate: https://flutter.dev/showcase
Windows es asequible, pero no se puede desarrollar iOS;
Mac es caro y puede desarrollar iOS y Android al mismo tiempo;

Entorno de desarrollo Flutter para construir la versión de Windows

¡Es imposible fingir que no sabe cómo conectarse a Internet! !

Instale el entorno Java: https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html ;
Descargué Java 8 aquí:
Una vez completada la instalación, haga clic con el botón derecho en "Mi PC", haga clic en "Propiedades" y seleccione "Configuración avanzada del sistema";
Seleccione la pestaña "Avanzado" y haga clic en "Variables ambientales";
Establezca 2 atributos en "Variables del sistema", JAVA_HOME, CLASSPATH (el caso no importa), haga clic en "Nuevo";

Nota: Si usa JDK versión 1.5 o superior, puede compilar y ejecutar programas Java normalmente sin establecer la variable de entorno CLASSPATH.

Cree un nuevo nombre de variable "PATH" en "Variables de usuario", el valor de la variable es:% JAVA_HOME% \ bin; (es el directorio bin de jdk, recuerde que hay un ";" después de él)

Una vez realizados los tres pasos anteriores, haga clic en "Variables de entorno" y "Aceptar" después de usar el acceso directo "Ctrl + R", tire de "cmd" seguido de la entrada de la línea de comando java -version, javasijavac el siguiente mensaje aparece en la configuración y si eso no funciona , Solo puede repetir las operaciones anteriores y reconfigurar nuevamente:

La tecla de acceso directo win + R abre la línea de comando cmd, ingrese java, si la siguiente figura muestra, la instalación es exitosa:
Descargue e instale FlutterSDK: https://flutter.io/sdk-archive/#windows
Después de la descarga, descomprima el paquete comprimido, busque el archivo como se muestra a continuación, haga doble clic para abrirlo:
obtendrá la siguiente interfaz:

entrada flutter -h:

En este paso, es posible que una VPN no funcione bien a veces. En este momento, puede considerar usar un espejo doméstico:
Pasos:

Computadora-> Propiedades-> Configuración avanzada del sistema-> Variables de entorno, agregue las dos siguientes en Variables de usuario:
① PUB_HOSTED_URL: https://pub.flutter-io.cn
② FLUTTER_STORAGE_BASE_URL: https: //storage.flutter-io. cn

Reinicia la computadora;

Borrar SDK de flutter -> directorio bin -> caché;

win + R ingrese cmd para abrir la línea de comando y vuelva a ingresar flutter -h;

Si el cuarto paso no funciona, ingrese cmd para abrir la línea de comando con win + R, ingrese flutter doctor, se dice que se actualizará automáticamente (no probado

Ruta de configuración:

cree una nueva ruta, copie la ruta de la carpeta bin en la carpeta flutter y finalmente win + R para abrir la línea de comando cmd e ingresarla.Si flutter -hes consistente con la pantalla anterior , la configuración es exitosa;
win + R para abrir la flutter doctorconfiguración de entrada de la línea de comando cmd , el entorno de diagnóstico mejor y, por ×lo general , no funcionan correctamente:
Descargue e instale Android Studio ;

Para conocer los pasos específicos, consulte el tutorial para principiantes ;

Instale el complemento de flutter en Android Studio:

reinicie después de la instalación, encontrará una línea adicional (como se muestra a continuación):
En este momento, luego win + R cmd para abrir la línea de comando, escribe flutter doctor:

una señal visual de que el certificado no está instalado, y nos dio la línea de comando para instalar el certificado, seguimos la entrada flutter doctor --android-licensespuede ser:

Cuando lo instales te hará muchas preguntas, todo yeso será suficiente ；
Ingrese nuevamente en este momento flutter doctor, y encontrará el último signo de exclamación: el

motivo es que la máquina virtual no se ha instalado;
En el siguiente paso, primero construimos un proyecto de flutter:

luego me quedo atascado directamente y no sé por qué, así que decidí ganar + R para abrir la línea de comando cmd, ingrese flutter create 项目名:

luego ingrese Android Studio para abrir el proyecto manualmente:

y luego este paso también lo es Lento, déjame agregar dos URL de proxy a mis variables de usuario:

FLUTTER_STORAGE_BASE_URL：https://storage.flutter-io.cn
PUB_HOSTED_URL: https://pub.flutter-io.cn
Entonces sentí que la velocidad no era buena, y me conecté a otra ola de ciencia, ¡y finalmente fue posible!

El siguiente paso es instalar la máquina virtual AVD:

Haga clic en la última versión para descargar: Una vez

completada la descarga, haga clic en Ejecutar: Cuando

la máquina virtual se enciende por primera vez, puede aparecer:

Solución: A menudo se informa un error porque el SDK no está seleccionado.
Haga clic en [Archivo] - [Estructura del proyecto] - [SDK del proyecto] y complete la ruta del SDK correctamente.

Después de abrir la máquina virtual, escriba flutter doctor en la terminal:

¡encontrará que todas las casillas de verificación están marcadas!
Después de abrir la máquina virtual, haga clic en Depurar:

luego fallé :

verifiqué que parece ser porque la versión de gradle es demasiado baja, intentaré actualizarla:

luego, después de una ola completa, probablemente significa que la versión mínima admitida debe ser al menos gradle 6.5, y luego corrí hacia arriba y hacia abajo nuevamente:

miré el sitio web oficial de gradle y encontré que la versión era 6.7.1, que era alta y estable, y eso fue todo. Después de una descarga, encontré la carpeta gradle en la computadora. La ruta es probablemente: C: \ Users \ 86135.gradle \ wrapper \ dists, todos son similares, puede consultar que

probablemente haya tantas versiones, pero las anteriores se descargan automáticamente antes, no las he instalado manualmente, cada Hay un directorio ilegible fijo debajo de la versión del directorio de archivos gradle:

el código fuente de esta extracción ilegible se encuentra a continuación:

puede modificar la versión que desea instalar para obtenerla:

package com.java.test1;

import java.math.BigInteger;
import java.security.MessageDigest;

public class Test1 {
    
    

	public static void main(String[] args) {
    
    
		// TODO Auto-generated method stub
		System.out.println(getHash("https://services.gradle.org/distributions/gradle-6.7.1-all.zip"));
//		System.out.println(getHash("https://services.gradle.org/distributions/gradle-3.2-all.zip"));
	}
	
	private static String getHash(String string) {
    
     
		try {
    
     
			MessageDigest messageDigest = MessageDigest.getInstance("MD5"); 
			byte[] bytes = string.getBytes(); 
			messageDigest.update(bytes); 
			return new BigInteger(1, messageDigest.digest()).toString(36); 
		} catch (Exception e) {
    
     
			throw new RuntimeException("Could not hash input string.", e); 
			} 
		}
}

Luego cambie esto nuevamente:
Inserte la descripción de la imagen aquí
esta vez hago clic en Depurar y no funcionará, ¡pero estará bien después de reiniciar!

Escriba el código de Flutter en VSCode

Primero, abra nuestro VSCode, descargue los complementos Flutter y Dart;

Luego, creamos un archivo llamado EmulatorRun.bat en el escritorio, hacemos clic derecho para editar, buscamos la ruta de emulator.exe y el nombre de la máquina virtual en nuestra computadora, y configuramos el retraso y la velocidad:
Inserte la descripción de la imagen aquí
Después de llenar Ctrl + S para guardar, después de cerrar, Haga clic derecho para ejecutar como administrador, puede ejecutar la máquina virtual directamente:

A continuación, mantenga la máquina virtual encendida, regresamos a VSCode, Ctrl + Shift + ~abrimos la terminal e ingresamos flutter run:
Inserte la descripción de la imagen aquí
Hay una forma más conveniente de abrir la máquina virtual:

como se muestra en la figura Mostrar, haga clic en [Sin dispositivo] en la esquina inferior derecha de VSCode, seleccione o cree una nueva máquina virtual:

El primer programa Hello World

Eliminamos todos los códigos del archivo main.dart y lo reescribimos nosotros mismos:

//引入UI库,material-ui官网:https://material-ui.com/zh/
import 'package:flutter/material.dart'; //dart与js不同,dart是一定要加末尾的分号的

void main() {
    
    
  runApp(MyApp());
}
/*
同样的意思,使用箭头函数的写法:
void main() => runApp(MyApp());
*/

class MyApp extends StatelessWidget {
    
    
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    
    
    return MaterialApp(
      title: 'Welcome to Flutter',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Welcome to Flutter'),
        ),
        body: Center(
          child: Text('Hello World'),
        ),
      ),
    );
  }
}

Luego ingrese flutter runejecutar en la terminal :
Inserte la descripción de la imagen aquí
puede ver que la ejecución es exitosa, debemos prestar atención a las teclas de atajo en el cuadro rojo;

Actualización de Flutter

Flutter sobre el futuro como la versión actualizada, puede ingresar directamente en la flutter upgradelata de actualización del terminal ;
pero después de que se complete una actualización general, simplemente ejecutar flutter runno se está dando la ejecución, por lo que la primera flutter clean, otra flutter run;