为什么我们在 react-native 中使用 ProgressViewIOS 组件中的 progressImage 属性？

Question

为什么以及如何在 react-native 的 <ProgressViewIOS/> 组件中使用 progressImage 属性？ documentation 似乎无法理解。任何人都可以在 iOS 上分享此属性的屏幕截图输出吗？谢谢！！！

Answer 1

progressImage 是用于填充ProgressViewIOS 的进度条部分的图像。

如果您为其提供自定义图像，progressTintColor 属性将被忽略。

图片：

progressImage.png

trackImage.png

输出：

代码：

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, ProgressViewIOS, Dimensions} from 'react-native';

const screenWidth = Dimensions.get("screen").width;

type Props = {};
export default class App extends Component<Props> {
  render() {
    return (
      <View style={styles.container}>
        <ProgressViewIOS 
        style={{width: screenWidth - 30}}
        progress={0.5}
        progressViewStyle = 'default'
        trackImage={require('./trackImage.png')}
        progressImage={require('./progressImage.png')}
        />
      </View>
    );
  }
}

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