ProgressBar does not render

[popoviciyoel]

Current behaviour

I import the dependencies and try to render component but nothing renders. I even pulled the exact example from documentation and nothing rendered on a fresh app.

Expected behaviour

I expect there to be a progress bar.

How to reproduce?

npx create-expo-app my-app cd my-app npx expo install react-native-paper

Preview

What have you tried so far?

Your Environment

software	version
ios	16.4
android	x
react-native	0.71.8
react-native-paper	^5.9.0
node	18.16.0
npm or yarn	9.5.1
expo sdk	~48.0.18

[popoviciyoel]

I hope I'm not making silly mistake, but I now this is a bug when other components render. This one doesn't for some reason.

[lukewalczak]

Please add code sample or create the expo snack

[popoviciyoel]

Please add code sample or create the expo snack

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';
import * as React from 'react';
import { ProgressBar, MD3Colors } from 'react-native-paper';

const MyComponent = () => (
  <ProgressBar animatedValue={0.5} style={{backgroundColor: 'red'}} color={MD3Colors.error50} />
);

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
      <StatusBar style="auto" />
      <MyComponent/>
    </View>
  );
}

Is this good enough? I have the most simplistic code, and it's not working.

[tjaniczek]

Hello @popoviciyoel, ProgressBar may be used in multiple different places (Views, Buttons, Pills etc) so we do not provide minimal width to it. I believe:

<ProgressBar animatedValue={0.5} style={{backgroundColor: 'red', width: 200 }} color={MD3Colors.error50} />

should work for you. Please confirm 🙏🏻

Usually, the ProgressBar is used inside a View, and that should work as well:

<View style={{ width: '100%' }}>
  <ProgressBar progress={progress} />
</View>

[popoviciyoel]

Thank you it worked. The documentation should specify this I believe. Thank you once again!

[Alanmc021]

:)