03- Flutter Windows: Crear proyectos desde Visual Studio Code
Summary
TLDREl script proporciona una guía detallada sobre cómo abrir y utilizar el simulador de Android en Visual Studio Code para crear una nueva aplicación. Se menciona la importancia de recordar atajos de teclado, la selección del directorio y configuración de la aplicación, y la solución de problemas comunes, como la selección de la versión correcta de Android y la instalación de componentes adicionales en Android Studio. También se sugiere actualizar y reiniciar para solucionar problemas y se ofrece consejo sobre la conexión de dispositivos físicos para pruebas futuras.
Takeaways
- 🖥️ Abrir Visual Studio Code es el primer paso para iniciar un nuevo proyecto con Flutter.
- 🔍 El atajo de teclado para 'flutter new project' es crucial para crear aplicaciones rápidamente.
- 📁 Seleccionar un directorio adecuado para guardar el proyecto es esencial para la organización.
- 🚫 Al nombrar la aplicación, evitar guiones y caracteres especiales, y no comenzar con números.
- 💻 La creación de la aplicación con Flutter es rápida y eficiente.
- 🔄 Utilizar la paleta de comandos para 'flutter run' permite lanzar la aplicación en un simulador o dispositivo.
- 📱 Seleccionar el dispositivo correcto es fundamental para probar la aplicación en el entorno deseado.
- 🛠️ Flutter detecta automáticamente las versiones de Android instaladas en la computadora.
- 🔍 Si hay problemas para encontrar la versión de Android, volver a una versión anterior puede ser una solución.
- 👨🏫 El troubleshooting abarca varias soluciones para errores comunes, como cambiar de versión de Android o reinstalar componentes.
- 🔄 Asegurar que las herramientas de línea de comandos estén actualizadas y reiniciar Visual Studio Code puede solucionar problemas de compilación.
- 🔌 Instalar el controlador USB de Google es importante para conectar y probar en dispositivos físicos.
Q & A
¿Qué es el simulador de Android y cómo se abre en el script?
-El simulador de Android es una herramienta que permite probar aplicaciones Android sin necesidad de un dispositivo físico. En el script, se abre a través de Visual Studio Code utilizando el comando 'florette new project'.
¿Cuál es el atajo de teclado más importante mencionado para usar en Visual Studio Code?
-El atajo de teclado más importante mencionado es el de la paleta de comandos 'Control + P' (o 'Command + P' en Mac), que se usa para buscar y ejecutar comandos en Visual Studio Code.
¿Qué nombre se le da a la aplicación en el script y cuáles son las restricciones para el nombre de una aplicación?
-Se le da el nombre de 'flórez' a la aplicación. Las restricciones para el nombre incluyen no poder comenzar con un número, no usar guiones y no incluir caracteres especiales, pero se pueden usar mayúsculas y números.
¿Cómo se selecciona la ubicación para crear la nueva aplicación en el script?
-Se selecciona la ubicación para crear la nueva aplicación en el script al elegir un directorio, en este caso 'escritorio', y luego crear un nuevo directorio llamado 'flórez' dentro de ese directorio.
¿Qué es 'florette' y para qué se usa en el script?
-'Florette' parece ser un comando o herramienta dentro de Visual Studio Code para crear nuevos proyectos de aplicaciones, como se muestra cuando se ejecuta 'florette new project'.
¿Qué sucede si no se encuentra la versión de Android que se necesita en el simulador?
-Si no se encuentra la versión de Android necesaria, el script sugiere volver a una versión anterior, como la versión 30, que se sabe que está instalada y no está marcando errores.
¿Cómo se resuelve el problema si el simulador no logra encontrar la versión de Android instalada?
-Para resolver este problema, se sugiere verificar la carpeta de instalación de Android en el SDK Manager y asegurarse de que la versión requerida esté presente. También se puede intentar una versión anterior de Android.
¿Qué es 'trooll shooting' y cómo se utiliza en el script para solucionar problemas?
-El 'trooll shooting' es un término que parece ser una variante de 'troubleshooting' (solución de problemas). En el script, se utiliza para abordar y resolver errores comunes que pueden aparecer al configurar o ejecutar la aplicación en el simulador.
¿Qué es el 'Teide Key Manager' y por qué se menciona en el script?
-El 'Teide Key Manager' no se describe en el script, pero su nombre sugiere que podría ser una herramienta para gestionar claves o configuraciones en el entorno de desarrollo. Se menciona en el contexto de instalar componentes adicionales que podrían ser necesarios para el funcionamiento de la aplicación.
¿Qué pasos se sugieren para solucionar problemas comunes al conectar un dispositivo físico para pruebas?
-Se sugiere instalar 'Google USB Driver' a través del SDK Manager para facilitar la conexión y pruebas de un dispositivo físico. También se recomienda asegurarse de que las herramientas de línea (Android SDK Tools) estén correctamente instaladas y configuradas.
¿Qué se debe hacer antes de continuar con el siguiente vídeo o clase?
-Antes de continuar, se sugiere leer el artículo relacionado con el contenido de la clase actual, ya que el siguiente tema será una extensión de lo aprendido hasta ahora, pero adaptado para diferentes sistemas operativos como Mac o Linux.
Outlines
😀 Configuración del entorno de desarrollo con Visual Studio Code
El primer párrafo describe el proceso de configuración del entorno de desarrollo para trabajar con una aplicación de 'flores' utilizando Visual Studio Code. Se menciona la importancia del atajo de teclado 'Control + P' para buscar comandos y la creación de un nuevo proyecto a través del comando 'florette new project'. Se detalla la selección de la ubicación del proyecto en el escritorio, la creación de un directorio llamado 'flórez' y la configuración del nombre de la aplicación, destacando que no se pueden usar guiones ni caracteres especiales. Además, se aborda el lanzamiento del simulador y la solución de problemas comunes, como la selección del dispositivo y la versión de Android, y se sugiere volver a una versión anterior del SDK si es necesario.
🔧 Solución de problemas y actualización de herramientas en Android Studio
El segundo párrafo se enfoca en la solución de problemas que pueden surgir durante el desarrollo de aplicaciones con Flutter, como la falta de actualizaciones o la necesidad de instalar ciertos paquetes en Android Studio. Se sugiere verificar la disponibilidad de actualizaciones y la instalación de paquetes como 'Intel x86 Atom System Image', 'Google APIs' y 'Google ARM 64'. También se menciona la instalación de 'Google USB Driver' para trabajar con dispositivos físicos y se da una breve descripción de lo que se cubrirá en la próxima clase, que incluirá la configuración de Flutter en diferentes sistemas operativos.
Mindmap
Keywords
💡Simulador de Android
💡Visual Studio Code
💡Paleta de Comandos
💡Flores
💡Directorio
💡Aplicación
💡SDK
💡Android Studio
💡Versión
💡Error
💡Google APIs
💡USB Driver
Highlights
Abrir Visual Studio Code y utilizar el atajo de teclado más importante para crear un nuevo proyecto.
Selección de 'Application' para crear una nueva aplicación en el directorio deseado.
Especificación de reglas para el nombre de la aplicación: no guiones, mayúsculas, números, pero no puede comenzar con número.
Proceso rápido de creación de la aplicación de Flores utilizando la paleta de comandos.
Selección del dispositivo y versión de Android para lanzar el simulador.
Solución de problemas si el simulador no se abre, sugiriendo comprobar la versión de Android instalada.
Cambio a una versión anterior de Android si se encuentran problemas con la versión actual.
Revisión de la carpeta 'android/app source' para solucionar problemas de compilación.
Detección automática de la SDK por parte de Flutter en las últimas versiones.
Solución de problemas mediante la instalación de componentes adicionales en Android Studio.
Instalación de sistemas de imagen x86, arm y Google APIs para solucionar problemas de compilación.
Reinicio del sistema después de instalar componentes adicionales en Android Studio.
Reapertura de Visual Studio Code para que los cambios tomen efecto.
Instalación del controlador USB de Google para conectar dispositivos físicos.
Prueba de cambios en tiempo real y mantenimiento del estado de la aplicación.
Solución de errores comunes en Flutter, como problemas de versión y falta de componentes.
Guía para solucionar problemas de compilación y ejecución de la aplicación Flutter.
Conexión exitosa del simulador y la aplicación Flutter, listos para continuar con el siguiente vídeo.
Aviso de que se abordará la configuración de Flutter en Mac OS y Linux en futuras clases.
Transcripts
[Música]
con simulador de androide abierto lo que
vamos a hacer es abrir visuales ubicados
no hace falta que lo tengan abierto por
cierto juego como lo hicimos en la clase
anterior igual no podemos lanzar desde
aquí ya les voy a enseñar una vez
ustedes abren visual studio code por
favor memorice este atajo es el más
importante yo creo de todos los
controles y pp para vivir el comando
palet aquí a buscar florette new project
seleccionamos application ahora me va a
pedir el folder en el cual yo quiero
colocar mis aplicaciones de flores en
este caso voy a seleccionar escritorio
puedo crearme un nuevo directorio por
acá nuevo folder que se llame flórez y
dentro de flores voy a seleccionar este
directorio ahora en pie el nombre de la
aplicación le voy a poner más abajo app
no pueden poner guiones lo puede poner
mayúsculas no pueden cargar caracteres
especiales no pueden hacer eso sólo
bienes bajos y caracteres inclusive
números pero creo que no puede empezar
con un número de ok entonces ese es el
nombre de la aplicación maya luego
pondremos otros nombres presionamos
enter y este procedimiento crear
aplicación de flores es bastante rápido
como ya lo tenemos listo entonces ahora
lo que vamos a hacer es lanzar
nuevamente la paleta de comandos vamos a
escribir flores selectivas inclusive
aquí ustedes podrían lanzarlo cuando
estaba detenido a la aplicación ustedes
pueden lanzarlo porque quiero aparecer
lanzar el simulador tal selecciona el
dispositivo en este caso es el now 10
app y le del 31
y presione f5 para abrir esto con sol y
posiblemente todo funciona aquí sin
ningún inconveniente pero esto es parte
de la solución de problemas que quiero
darles también ok para las personas que
ya está bueno que esto sigue trabajando
y sigue continuando y ustedes ya van a
ver la aplicación eso está bien y ya
pueden terminar este vídeo porque eso es
todo lo que quiero hacer exceptuando de
que eventualmente podemos probarlo si
hacemos algún cambio por algún lado ya
vamos a ver pero para los que tenemos
este error o un error similar vamos a
hacer el respectivo troll shooting o
tratar de resolver la mayor parte de
estos errores
ahora desde las últimas versiones de
flores ya flores detecta automáticamente
eléctrica y que está instalado en su
computadora ok eso ustedes lo pueden ver
estando aquí todos los nuestro trocito
pueden ver nuevamente todo el proyecto
ahora a la carpeta de android app source
y es el vil punto grave que está aquí si
no estoy mal porque hay 2.000 puntos
reynoso que android app y está justo al
lado del soul de la carpeta shorts no el
punto creo que está a nivel de proyecto
el nivel de aplicación porque está al
lado del sol dan doble clic aquí
entonces está buscando una versión de
android 31 que es la que ya está
instalada en mi equipo pero por alguna
razón no lo está logrando encontrar se
puede hacer entre verín para asegurarme
de que esté localizado desde que en ese
director y toda la cosa
pero lo más fácil para resolver es
simplemente irme a la versión anterior
que también yo sé que está instalada que
sería la versión 30 con paneles de cake
en la versión anterior que el número que
le esté marcando errores éstos son
trolls surín que tenemos que voy a
grabar los cambios abran el main que
está en nuestra carpeta live nuevamente
en la aplicación que habíamos visto al
inicio y presione f5 ya tenemos
seleccionado nuestro dispositivo y esto
debería de lanzar la aplicación
esto para las personas que tienen el
problema de que no logra encontrar ese
número pero si esto tampoco les funciona
ya les voy a enseñar otra parte de él
trobal shooting ok por - los errores más
comunes que yo he visto para tratar de
resolverlos y que podamos seguir con la
menor cantidad de problemas o que por
menos que logremos lanzar la aplicación
pero ustedes puede observar aquí está
puedo tocar el botón del más y tenemos
la respectiva los respectivos cambios
acá
si ustedes se van asumen esto solo para
hacer una pequeña prueba que en teoría
todo está bien pueden buscar donde diga
o que es presionado tantas veces están
pueden poner hola mundo los puntos tabs
dos puntos graben los cambios y aquí ya
deberían de ver rápidamente los cambios
aplicados y mantiene su estado podemos
tocar este botón para hacer un futuro y
estar entonces debería de regresar a
cero y empezamos otra vez perfecto ya
está trabajando nuestra aplicación bueno
visto el estudio está conectado con el
simulador y en teoría si ustedes lo
tienen así ya lo pueden dejar y seguir
el siguiente vídeo
pero para las personas que tienen
problemas para levantarlo voy a irme por
los errores más comunes que he visto un
error bastante común es este que colocar
el stick a la versión anterior o el
número anterior otro error común que
podemos ver es que abramos el android
studio y posiblemente nos hace falta
algún tipo de instalación aunque ya
hicimos toda la instalación según la
documentación de flora pero si ustedes
se van al teide key manager
loops haremos nuevamente el android
estudio junio ok entonces hay veces hay
veces que en el ex de kate nosotros
ocupamos instalar ciertas cositas acá en
el este que no tenga aquí está en el
perdón aquí en el es de que yo estoy en
la peleó el 31 y también tengo el 30 que
es el que es el que vino por defecto en
mi instalación actualmente tenemos una
actualización disponible
si tocamos aquí show paquetes de tls
vamos a ver más información entonces
posiblemente lo que ustedes van a ocupar
acá obviamente no lo de televisión eso
no pero si vamos a ocupar
posiblemente lo que son intel x86 atom
64 este sistema image y lo de google
google eyed peas o google
arm 64 y todo lo que está relacionado a
google lápiz porque también en google
place si ustedes quisieran pero
básicamente serían las de google apis
ustedes las instalan para la versión de
haber que tiene
posiblemente les va a pedir que
reinicien o algo parecido y recuerden
asegúrense de eso que lo hicimos en la
clase pasada
como and line tools
ok voy a darle ok nuevamente y esto
debería de ser más que suficiente para
que ustedes bueno cierran el visual
studio code y lo vuelven a abrir
y con eso deberíamos de estar más que
bien solo que antes de continuar y
terminar la clase
esto es una adición que estoy haciendo
en el sdk y manager seleccionen tools y
aquí por favor también instalen en
google y usb driver esto les va a servir
cuando quieran conectar un dispositivo
físico y hacer pruebas que es algo que
se hace un poquito más adelante en esta
misma sección oye eso es básicamente
todo espero que también pudieran haber
hecho este ejercicio y nos vemos en la
próxima clase que
lean el artículo porque ya viene la
parte de hace esto mismo pero en ellos o
en una mac o sx nos vemos la próxima
clase o la próxima elección donde vamos
a empezar a continuar con nuestro camino
de flores
Ver Más Videos Relacionados
Actividad 1 Google Docs
Curso de Android con Java: Lanzar una segunda Actividad
Cómo instalar y configurar SQL Server 2019
Como CONFIGURAR IPSEC VPN Server y Cliente | Tutorial paso a paso
Como Utilizar Cisco Packet Tracer desde Cero 2020
Curso de Android con Java: Almacenamiento mediante la base de datos SQLite
5.0 / 5 (0 votes)