hola a todos, bienvenidos a mi canal,
en este video creamos una aplicación de Android usando WordPress y el complemento del editor de aplicaciones móviles,
crearemos una aplicación desde cero y usaremos esta plantilla como referencia para el
diseño de nuestra aplicación. ingrese el nombre de la aplicación y luego cree una nueva aplicación, la aplicación
estará vacía sin ninguna página primero, debemos agregar una nueva página, ingrese el nombre de la página y configure
la pestaña inferior y la navegación, configure el ícono para nuestra página de inicio y Guardar ahora
tenemos un hogar página si la vista previa sigue siendo una página vacía volver al modo Builder en el panel de capas
vemos que solo hay un componente de contenedor abramos la pestaña Adder del complemento como nuestra referencia crearemos este diseño, la
sección del encabezado contiene dos textos y un botón, está bien volver a nuestra aplicación agreguemos el primer texto
arrastrando el componente de texto al contenedor de esta manera y luego cambiemos el título del texto ahora necesitamos agregar el segundo texto
puede arrastrar el componente de texto nuevamente o podemos duplicar un duplicado
para el primer texto como este, cambiemos el contenido del segundo texto,
copiemos este texto, está bien, eso es para nuestro segundo texto, ahora necesitamos agregar un botón, tomar el
componente del botón y luego cambiar el título del botón, ahora necesitamos organizar este componente para que le guste esto plantilla necesitamos agregar un nuevo contenedor contenedor y luego colocar el botón y el
texto dentro de este nuevo contenedor como este seleccionar el contenedor nuevamente
y luego configurar el contenedor hey, usemos 300 píxeles como este ahora necesitamos colocar nuestro componente en el
centro de usted puede configurar las propiedades de justificación del contenido la opción simple aquí Centrar espacio entre espacio alrededor y espacio uniforme
usemos la opción central y ahora necesitamos agregar un poco de margen al
texto configuremos el margen inferior use 16 píxeles también necesitamos hacer el primer texto más grande
cambiemos la categoría de texto usando la oculta ahora seleccione el segundo texto y agreguemos un margen también use el píxel 16 seleccionemos el contenedor nuevamente queremos
cambiar e Alinee el elemento dentro de este contenedor opción de receta aquí que usa
la opción de inicio como esta y ahora necesitamos agregar algo de fondo agreguemos el componente de imagen configuremos imagen seleccione imagen
que puede usar puede agregar una nueva imagen o seleccionar la imagen disponible en
la galería usemos esta imagen ahora necesitamos establecer el ancho y tomar para esta
imagen usaremos 100 de ancho y 300 píxeles de merluza necesitamos poner esta imagen como fondo
para esto necesitamos un nuevo contenedor lo necesitas como exterior contenedor necesita mover este contenedor
dentro de este y también la imagen que necesita para colocar la imagen
en la parte superior porque necesitamos esta imagen como contenido como fondo eliminemos el relleno el relleno del contenedor
seleccione la imagen déjeme subir así, puede mover el componente
arrastrándolo o usando este botón para hacer que la imagen sea un fondo.
Necesitamos configurar
este contenedor como una posición absoluta. Así, la imagen estará detrás de este
contenedor. Así estaremos. Necesito configurar el fondo para este
contenedor, hacerlo transparente para mostrar la imagen de esta manera cuando esté configurado como
transparente del fondo. Usaré el fondo negro
y diré transparente al 30 por ciento como este y luego cambiaré el color del texto para que
sea factible. use el color blanco también el segundo texto cambie el color de la fuente queremos que este segundo texto sea
ligeramente diferente con el primer texto solo uso el color gris aquí ligeramente gris bien así también necesitamos cambiar el color del botón seleccionar
el botón que seleccionamos el componente usando el panel de capas o haga clic en combinar directamente
cambiemos el color de fondo para este botón, necesitamos establecer el
color de fondo y el color del borde así, veamos una vista previa de nuestra aplicación
esta es la vista previa o aplique ahora mismo, de acuerdo, volvamos al modo Builder, vamos agregue la segunda sección para nuestra página de inicio pero primero quiero crear una nueva página aquí
como destino para nuestro botón cuando haga clic en él nuestra segunda página muestre la barra de encabezado ahora h ave to page,
agreguemos contenido aquí para identificar nuestra página, sí, contenido ficticio, crearemos esta página en otro video, ahora volvamos a nuestra página de inicio, seleccionemos el botón aquí y
configuremos la acción al presionar, seleccione el conjunto de acciones para navegar, de modo que el botón ser navegado cuando haga clic en
él y configure el destino de navegación, repasemos, está bien, eso es para volver a nuestro modo Builder, es nuestra nueva página de llegada y esta es nuestra página de inicio.
De vuelta a nuestra aplicación, primero debemos agregar el contenedor de la segunda sección dentro del contenedor principal como este este contenedor para nuestra segunda sección
que es agregar texto para el título comprar por categoría oh, necesito volver a copiar el texto, cambiemos la categoría de este texto
solo calentando nuestro encabezado 5 como este ahora necesitamos agregar otro contenedor para la imagen de categoría y puede
hacerlo nuevamente y luego agregar una imagen seleccione la imagen para nuestra primera
categoría usemos esto imagen, ya que necesita agregar el texto para la categoría. Puede que el contenedor contenga de forma predeterminada relleno y luego debemos eliminar
el relleno. Use cero relleno como este. También necesito establecer el ancho de este contenedor.
Texto necesitamos este texto para posicionar absoluto y necesitamos establecer este texto en la
parte inferior para establecer la posición inferior cambiar el color de la fuente para que sea
visible usemos el color blanco y configuremos la categoría de texto que usa el encabezado 6 configuremos el contenedor elemento de línea en el centro con el texto ligeramente tigre que es
la parte inferior del píxel de huevo como este, cambiemos el ancho y el heno
para el contenedor y la imagen, también debe configurar los bordes del borde
para la imagen, repasemos, está bien, esto es bueno para mí Volvamos a nuestro modo Constructor.
Dupliquemos esta categoría. Necesitamos tres categorías como esta, pero necesitamos que
la categoría se organice horizontalmente. Establezcamos esta dirección en el contenedor horizontal de la
categoría como esta y establezcamos en desplazable como este, agreguemos un margen a la derecha para cada categoría, así que imagínese directamente a la segunda categoría, eliminemos el relleno para este contenedor, configúrelo en relleno cero, necesita agregar algo de margen al texto, establezcamos
el margen superior y el botón de margen para esto texto veamos una vista previa de nuestra aplicación ahora necesitamos eliminar estos espacios en blanco en blanco
configure el contenedor que necesita para configurar el relleno a cero bien así ahora necesitamos cambiar la
imagen para la segunda categoría usemos este texto también cambie el texto ahora cambie el segunda categoría cambia la imagen hay una opción para que la imagen
cambie el tamaño del modo para la imagen que es el modo de portada este es
el modo predeterminado para la imagen también cambia el texto para la tercera categoría revisemos nuestra aplicación ahora mismo está bien para mí también Necesito agregar un margen como imagen, también puedo escribir en esta segunda categoría, está bien, así, agreguemos una página de búsqueda para nuestra categoría, la página de sudaderas con capucha, agreguemos texto como
contenido ficticio para esta página.
Volver a la página de inicio y establecer
el contenedor en Presionar cuadro acción seleccionar acción y elegir navegar a casa
decir para navegar a quién esta página cuando al pulsar Vamos a probarlo de nuevo
hagamos clic en esta categoría y vayamos a la página de sudaderas con capucha y el
primer botón vaya a haga una nueva página de llegada, está bien, ese es nuestro video por
esta vez, crearé el en