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

Question

为什么以及如何在react-native中使用progressImage组件中的<ProgressViewIOS/>属性？ 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',
  },
});