Sigamos trabajando en la página de las tarjetas.
Justo abajo del tipo 1 voy a colocar un sandbox sandbox para poner un cierto espacio entre ésta y la
otra tarjeta que quiero poner.
Aquí seleccionamos un Jaitt y coloquemos unos 30 puntos cero algo así un espacio de 30.
Justo después de ese sandbox vamos a colocar ahora un kart tipo 2.
Este método no existe.
Lo vamos a crear en este preciso instante.
Copiamos esto voy a comprimir Tipo 1 porque no lo voy a usar.
Y aquí también regresamos un widget tipo 2 abril se Abangares Car.
Lo mismo con Enter.
Comenzamos a trabajar con esta tarjeta tipo 2 que es lo que quiero hacer.
Quiero ser una tarjeta que tenga una imagen y a su vez voy a enseñarles una técnica que podemos usar
para poner un Pleiss folder o una imagen que se va a aparecer o se va a mostrar mientras la imagen original
está cargando porque supuestamente es un servicio de internet o estamos cargando de algún lugar y no
es tan rápida como si estuviéramos en el disco de dispositivos en el disco del dispositivo.
Así que comencemos.
Tengo My Car le voy a poner el chip TAP que va a tener una columna una columna tar tap y aquí tenemos
nuestro Children Enter.
Nada que no hayamos hecho antes.
Dentro de este Children yo voy a colocar una imagen imagen Tab y noten que el imatge es un widget es
un Steinfeld Widget.
Voy a poner acá un paréntesis y tengo todas estas propiedades.
Elegí el Flipy del huid entre otras cosas.
Lo que yo necesito o lo que me pide por defecto es colocar la imagen en este caso sería el imagen que
tiene que Septem y Mazz.
No sé si ustedes vieron que es de tipo y Mazz Provider.
Para eso voy a escribir Network Image o cargar una imagen desde un wherever les voy a pedir que vayan
a Google busquen landscapes que quiero tengo déjeme colocarlo aquí porque se mira así.
Un segundo si tenía un zoom buscan se landscapes y también háganme el favor de buscarse uno bastante
grande unas dimensiones enormes está bien.
Por ejemplo este de 2000 este está bien vamos a ver si tenemos otro de 3000.
La verdad no tendría mucho sentido renderizar una imagen con tantos píxeles pero lo que me va a servir
o el ejemplo me va a servir para demostrarles como seres.
Voy a copiar hacer click derecho acá copiar el iMac address asegúrese de que ustedes lo puedan ver así
com pegando el R.L y vamos a trabajar con esta imagen que ustedes usen cualquiera que encuentren ahí
sin preferiblemente sin derecho de autor para que no me vayan a demandar a mí por usar esta imagen.
Ok entonces el R.L bastante bueno se explica solo y voy a pegar todo el R.L voy a grabar los cambios
y vamos a ver qué sucede.
Esperemos un segundo tardó un rato y apareció la imagen.
Hay varias cosas que no me están gustando acá.
Por ejemplo las tarjetas se supone que tienen bordes redondeados.
Más adelante les voy a enseñar cómo incrementar sus bordes pero no lo está respetando.
Si nosotros colocamos abajo de esta imagen voy a poner aquí una coma Enter.
Si yo coloco acá ahora un texto o en un texto que diga algo como No tengo idea de qué poner y grabó
los cambios vamos a observar que si tiene bordes redondeados pero que arriba no los están respetando
y eso sale muy pegado.
Vamos a utilizar ahora otro widget llamado container UPS.
Creo que ya lo hemos hecho antes pero es como un DIV HTML.
La manera más sencilla es que ustedes ponen el cursor sobre el texto control punto o punto y lo envuelva
en un container.
Ok de esta manera esto es lo que hace arreglar la población un poco para que quede más claro el container
tiene un PADI y el padre de ustedes ya saben eches en set.
Voy a ponerlo o de unos 10.0 saber qué tal se ve.
Ahí tenemos una separación.
No está mal pero aquí nos pasa.
Bueno pasan varias cosas.
Si yo hago un pilot no Tenca la imagen en ningún momento se pierde sigue estando en el caché.
Pero si yo hago un restart ya van a ver.
Esperemos un segundo veremos un segundo tengo tarjetas está cargando la imagen y eventualmente puff
aparece.
Eso no me gusta y flojeras nos ofreció un widget súper útil para trabajar los Ladines de las imágenes.
Eso se llama Feith y imatge.
Aquí otro widget Faith in Image parentesis Koma Enter.
Voy a comentar todo este match porque no lo voy a usar de esa manera.
El fail in Image tiene varios requisitos.
Uno de ellos vamos a ver si os muestro al final recita un Pleiss folder que el play the order es la
imagen que debería de estar físicamente en el dispositivo porque cargaría casi de forma instantánea
y es la que se va a observar ahí mientras la imagen que viene por la web es mostrada o es cargada.
Mejor dicho para poner un Pleiss oler bonito.
Les voy a pedir que vayan al material adjunto y se descarguen esta imagen que yo tengo acá es un loading
bastante bonito es un gif o gif o como ustedes le digan pero son GIF esta imagen yo la voy a copiar
y necesito ponerla en mi proyecto entonces flogger componentes.
Vamos a quedarnos aquí en esa misma carpeta o en ese mismo directorio donde tenemos la data click derecho
y se va a llamar assets con doble ese.
Y aquí vamos a mover nuestra imagen de Yar loading.
Regresemos a nuestra aplicación.
Ok yo no puedo poner directamente la imagen acá o sea usarla no puedo hacerlo.
Por qué.
Por la misma razón que nosotros tuvimos ese inconveniente cuando trabajamos con un Jayson.
Yo necesito decirle a mi aplicación que ahora tenemos estos assets que es esta imagen.
Yo necesito decirle a mi proyecto que ahora tiene esa imagen que es un recurso estático.
Para eso nos vamos al pop Speck puntos Jam.
Vamos a abrirlo y aquí búsquense búsquense qué haces.
Voy a citar este comentario removiendo ese numeral use Path y asegúrese de tener la tabulación correcta.
Aquí no estamos buscando esta imagen esa imagen a saber es un ejemplo pero aquí estaríamos trabajando
con assets teslas y pondríamos el nombre del Yar kion loading.
Pero Fernando me van a preguntar Fernando y si tuviéramos un montón de imágenes cómo bueno sería una
pereza definir las Togashi sería una huelga.
Entonces qué les parece si las importamos todas de esta manera simplemente ponemos aceptais algunos
cambios.
Esto hace el Floreal paquete que ya lo hizo termina y de esta manera importa todo lo que esté en esa
carpeta de ases tienen que tener cuidado no vayan a poner mucha información ahí ustedes sabrán qué es
lo que van a importar en su proyecto.
Perfecto cierro antes de probar esto antes de probarlo.
Necesitamos hacer un listado completo.
Por eso voy a comentar estas líneas para que no me dio un error voy a grabar los cambios.
Mi aplicación tiene que funcionar o detener la aplicación y voy a volver a presionar control F5 F5 nada
más hay que esperar que esto vuelva a levantar.
Para poder utilizar ese recurso estático recuerden que cada vez que ustedes ponen recursos estáticos
en las carpetas del proyecto es recomendable hacer un full Ristar entonces hagan eso también no vayan
a ser perezosos y vayan a probarlo porque les pueden salir errores.
Pareciera que no me voy y la cuantoa.
Vamos a ver si que no levantó no saber qué pasó y buscó Hansson dice que no encontró ninguna variante
para el archivo hace alguien me faltó un Lassen assets laceran.
Creo que a mi me faltó ponerle algo aquí en el post Speck voy a bajar me costó poner un es para indicar
que es un directorio.
Voy a grabar los cambios nuevamente se fue harpa cachet.
Cierro cierro ya y probemos de nuevo el F5 esperemos que esto levante dejar el debut Consol para asegurarme
de que no tengamos ningún error y que lo levante sin ningún problema.
Vamos a dejarlo así esperemos un segundo
porque aquí tuvimos un error.
Vamos a ver qué fue el error parece que sí se cargó que parece que el fichaje Wílder lista Dinamic tuvo
un problema en pero si lo cargo ya lo voy a revisar ya vamos a revisar este problema si yo hago un blog
si está funcionando mejor Ristar o si lo hace pero tenemos este error.
Ya no vamos a resolver aquí tendremos un problema que tenemos en la siguiente clase porque aparentemente
en algún momento nosotros estamos llamando Cholbi estamos llevando un frizz y ese hecho no tiene nada.
O sea en ese momento pareciera que no hay información en el frizz ya llegaremos eso en la siguiente
clase ok no se preocupen ya resolveremos ese error mientras terminemos nuestro ejercicio de las tarjetas
pero obviamente no va a aparecer porque yo la removía.
Entonces aquí voy a colocar lo que es el imatge la imagen real que voy a colocar es un network match
y match que tenía aquí abajo de hecho lo voy a copiar y pegar aquí pego asegúrense con terminar con
una coma porque quiero poner otra propiedad y aquí voy a colocar el Place Wolder que es la propiedad
que me está pidiendo o que es necesario en un Feith y aquí necesito mostrar una imagen de los Aces que
en este caso la imagen de los assets que quiero mostrar es techar loading entonces Asset Image Tapp
entre comillas tengo que especificar este archivo que quiero colocar ahí que sería assets las Yar menos
loading apuntó GIFF.
Asegúrese de que el nombre sea correcto llamarlo o de unpunto GIF.
Voy a grabar los cambios.
Esto debería hacer o mostrar nuestro loading y cuando ya tenemos la imagen aparece.
Si se preguntan Oh qué bonito se vio.
Pero la imagen que entró muy lento podemos configurarlo y también tenemos animaciones por defecto que
veremos después como para hacer efectos más bonitos.
Si yo quiero acelerarlo aquí hay una propiedad que se llama duration que está acá hindú Battión Tapp.
Si dejamos el mouse encima esto dice que recibe un duration de tipo Feith duration.
Vamos a probarlo.
Duration tab que esto ya lo usamos en la parte de la introducción.
No sé si se acuerdan para hacer un time out y el duration cuánto quieres poner ustedes.
Yo les voy a poner de unos 200 milésimas de segundo entonces o milésimas del segundo milisegundos de
200 grados loscambios y no va a aparecer la imagen.
Por qué.
Porque la imagen ya está cargada.
Tengo que hacer un otro ISTAT para vaciar el caché y que esta imagen se vuelva a cargar con tarjetas
que empiece a cargar y listo.
No sé si ustedes no están tan bien para terminar que la imagen se está moviendo o sea empiezo a hacer
loading y como que no tienen la misma el mismo ancho.
Puedo ponerle un alto en específico podemos poner un gif de unos pocos unos 400 píxeles a ver qué tal
se me va a quedar un poco de espacio suponer de unos 250.
No necesito que quede tan preciso y aquí también tenemos otra propiedad llamada Fit que sirve para indicarle
cómo la imagen debe de ocupar el espacio que tiene.
Si yo dejo el mouse encima tengo que recibió un box suit.
Entonces vamos a ver Boggs fit y tenemos varias propiedades estáticas contain cover Phill vamos a utilizar
el cover.
Ya vamos a ver más adelante otro tipo de imágenes pongámosle un poquito más pongámosle de 300.
Ok abarca todo el ancho.
Vamos a hacer un TriStar para ver si nuestra imagen tanto del jardín como esa tienen las mismas dimensiones
para que no se mire que se mueva.
Esto no debería de moverse nuestro nuestra tarjeta y así lo hizo.
Pronto vamos a trabajar con los estilos de las tarjetas y prevenir que mi imagen no muestre el borde
redondeado de la tarjeta pero este video ya se hizo muy largo lo vamos a dejar así continuamos con la
siguiente clase.