css - 将图像大小调整为居中
问题描述
我有这样的图像:
我正在尝试制作一个 100x100 的正方形,然后将该图像居中。我可以使用以下代码获得 100x100 的正方形:
import * as React from 'react';
import { View, Image, StyleSheet } from 'react-native';
class App extends React.Component {
render() {
return (
<View style={styles.container}>
<View style={styles.imageContainer}>
<Image
source={{ uri: 'https://storage.googleapis.com/iex/api/logos/GOOGL.png', }}
style={styles.image}
/>
</View>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center'
},
imageContainer: {
borderWidth: 1
},
image: {
width: 100,
height: 100
}
});
export default App;
但是,这会切断图像:
有没有办法可以设置 100x100 的宽度/高度,但允许图像根据需要调整大小以适合并在正方形内居中?谢谢!
解决方案
推荐阅读
- javascript - 如何在 JavaScript 中将对象转换为数组?
- c - 旋转我的船坐标的问题
- python - 通过 Selenium 启动 Electron 应用程序时出现“未知错误:DevToolsActivePort 文件不存在”
- reactjs - 将 React.memo 与映射集合一起使用
- xml - xpath 是否可以解析 html 内容,包括
? - javascript - 如何将文本字段更改为按钮
- python - 在方法中更改一行会产生我不明白的后果
- java - 如何使进度条上的进度号可见?
- google-bigquery - 如果可能,如何在 Google Bigquery 上为回测设置追踪止损
- php - “未定义的变量”虽然已定义