feat(native-participants-pane) slider ui fixes

This commit is contained in:
Calin Chitu 2021-07-01 17:37:45 +03:00 committed by Hristo Terezov
parent 600af62945
commit 7854437e31
2 changed files with 11 additions and 7 deletions

View File

@ -1,9 +1,8 @@
// @flow // @flow
import Slider from '@react-native-community/slider';
import _ from 'lodash'; import _ from 'lodash';
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { View } from 'react-native'; import { View, Slider } from 'react-native';
import { withTheme } from 'react-native-paper'; import { withTheme } from 'react-native-paper';
import { translate } from '../../../base/i18n'; import { translate } from '../../../base/i18n';
@ -16,6 +15,9 @@ import { connect } from '../../../base/redux';
import { setVolume } from '../../../participants-pane/actions.native'; import { setVolume } from '../../../participants-pane/actions.native';
import { VOLUME_SLIDER_SCALE } from '../../constants'; import { VOLUME_SLIDER_SCALE } from '../../constants';
import styles from './styles';
/** /**
* The type of the React {@code Component} props of {@link VolumeSlider}. * The type of the React {@code Component} props of {@link VolumeSlider}.
*/ */
@ -101,16 +103,18 @@ class VolumeSlider extends PureComponent<Props, State> {
const onVolumeChange = _startSilent ? undefined : this._onVolumeChange; const onVolumeChange = _startSilent ? undefined : this._onVolumeChange;
return ( return (
<View> <View style = { styles.volumeSliderContainer } >
<Icon <Icon
size = { 24 } size = { 20 }
src = { IconVolumeEmpty } /> src = { IconVolumeEmpty }
style = { styles.volumeIcon } />
<Slider <Slider
maximumTrackTintColor = { palette.field02 } maximumTrackTintColor = { palette.field02 }
maximumValue = { VOLUME_SLIDER_SCALE } maximumValue = { VOLUME_SLIDER_SCALE }
minimumTrackTintColor = { palette.action01 } minimumTrackTintColor = { palette.action01 }
minimumValue = { 0 } minimumValue = { 0 }
onValueChange = { onVolumeChange } onValueChange = { onVolumeChange }
style = { styles.sliderContainer }
thumbTintColor = { palette.field02 } thumbTintColor = { palette.field02 }
value = { volumeLevel } /> value = { volumeLevel } />
</View> </View>

View File

@ -63,7 +63,7 @@ export default createStyleSheet({
}, },
sliderContainer: { sliderContainer: {
marginLeft: BaseTheme.spacing[3], marginLeft: BaseTheme.spacing[2],
minWidth: '88%' minWidth: '92%'
} }
}); });