Как позиционировать дочерний вид в правом нижнем углу компонента "Реагентный образ"? Я разрабатываю приложение с React-Native. Я хочу поместить значок в правый нижний угол компонента изображения, но он всегда остается в левом верхнем углу. Любая помощь? Большое вам спасибо. Ответ 1 <Image source={imageSource} style={{position: "absolute", bottom: 0, right: 0}}/> Ответ 2 Вы можете использовать justifyContent: 'flex-end' для достижения этой цели: const withWatermark = (asset, logo) => ( <Image style={{ width: 200, height: 200, justifyContent: 'flex-end' }} source={asset}> <Image style={{ width: 20, height: 20, alignSelf: 'flex-end' }} source={logo} /> </Image> ); Ответ 3 Вы можете сделать что-то вроде этого... Используйте это: position: "absolute", bottom: 0, alignSelf: "flex-end" <ImageBackground source={require("../assets/homeAssets/3.jpg")} style={{ height: 140, width: 140, resizeMode: "contain", alignItems: "center" }} imageStyle={{ borderRadius: 70 }} > <View style={{ height: 50, width: 50, borderRadius: 25, backgroundColor: "#99AAAB", alignItems: "center", justifyContent: "center", position: "absolute", //Here is the trick bottom: 0, alignSelf: "flex-end" }} > <Entypo name="camera" size={25} color="#FFF" /> </View> </ImageBackground>
Ответ 2 Вы можете использовать justifyContent: 'flex-end' для достижения этой цели: const withWatermark = (asset, logo) => ( <Image style={{ width: 200, height: 200, justifyContent: 'flex-end' }} source={asset}> <Image style={{ width: 20, height: 20, alignSelf: 'flex-end' }} source={logo} /> </Image> );
Ответ 3 Вы можете сделать что-то вроде этого... Используйте это: position: "absolute", bottom: 0, alignSelf: "flex-end" <ImageBackground source={require("../assets/homeAssets/3.jpg")} style={{ height: 140, width: 140, resizeMode: "contain", alignItems: "center" }} imageStyle={{ borderRadius: 70 }} > <View style={{ height: 50, width: 50, borderRadius: 25, backgroundColor: "#99AAAB", alignItems: "center", justifyContent: "center", position: "absolute", //Here is the trick bottom: 0, alignSelf: "flex-end" }} > <Entypo name="camera" size={25} color="#FFF" /> </View> </ImageBackground>