gpt4 book ai didi

javascript - 在 React-native 中在 iOS 上的 样式中使用百分比/相对值

转载 作者:行者123 更新时间:2023-12-04 07:58:40 28 4
gpt4 key购买 nike

我想在 react-native 做这样的事情

<View
style = { width: '100%', padding: 10, borderRadius: '25%' }>
{...}
</View>
但我得到(在 iOS 上)

JSON value '25%' of type NSString cannot be converted to NSNumber


有没有办法使用相对/百分比值作为 borderRadius 的样式输入?

最佳答案

你可以做类似的事情,使用 ref为了引用该元素,您可以测量其宽度(不是百分比)并计算边框半径。

import React, { useRef, useEffect, useState } from 'react';
import { Text, View, StyleSheet } from 'react-native';

export default function App() {
const ref = useRef();

const [width, setWidth] = useState(0);

useEffect(() => {
ref.current.measure((x, y, w, h) => {
setWidth(w);
});
}, []);

return (
<View style={styles.container}>
<View
ref={ref}
style={{
width: '80%',
padding: 10,
backgroundColor: 'red',
borderRadius: width / 4, // 25%
}}
/>
</View>
);
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
},
});

关于javascript - 在 React-native 中在 iOS 上的 <View/> 样式中使用百分比/相对值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66578282/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com