0
270
Vistas¿Cómo organizas las formas en React Native?
Estoy tratando de organizar los cuadrados tal como se ven en la imagen, pero realmente no puedo descifrar todo el asunto de la flexión y el posicionamiento: cuadrados
Esto es probablemente muy simple, pero simplemente no puedo resolverlo.
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Bueno, aquí hay una versión rápida y sucia de tu foto.
import React from "react" import { StyleSheet, View } from "react-native" export const Test = () => { return ( <View style={styles.container}> <View style={styles.row}> <View style={[styles.square]} /> <View style={[styles.square]} /> <View style={[styles.square, { backgroundColor: "yellow" }]} /> <View style={[styles.square, { backgroundColor: "turquoise" }]} /> </View> <View style={styles.row}> <View style={[styles.square, { backgroundColor: "red" }]} /> <View style={[styles.square, { backgroundColor: "blue" }]} /> <View style={[styles.square, { backgroundColor: "green" }]} /> <View style={[styles.square, { backgroundColor: "violet" }]} /> <View style={[styles.square, { backgroundColor: "yellow" }]} /> </View> <View style={[styles.square, { backgroundColor: "lightgrey", height: 25, width: 300 }]} /> </View> ) } const styles = StyleSheet.create({ container: { display: "flex", }, row: { flexDirection: "row", }, square: { width: 60, height: 60, }, })lo que da lugar a la siguiente vista.
·
Juan Pablo Isaza
Denunciar
Responde la pregunta