Почему мы используем свойство progressImage в компоненте ProgressViewIOS вact-native?

Question

Почему и как использовать свойство progressImage в компоненте <ProgressViewIOS/> вact-native? Документация не кажется понятной. Может кто-нибудь поделиться выводом скриншота этого свойства на 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',
  },
});