[RN] Use rounded avatars in the film strip

Also move (native) avatar style to film-strip styles, since  that's where it
applies. This is analogous to how the large-view avatar is styled.
This commit is contained in:
Saúl Ibarra Corretgé 2017-04-07 17:26:51 +02:00 committed by Lyubo Marinov
parent 98004c2328
commit 50fea44ce2
4 changed files with 15 additions and 12 deletions

View File

@ -1,8 +1,6 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Image } from 'react-native'; import { Image } from 'react-native';
import { styles } from './styles';
/** /**
* Display a participant avatar. * Display a participant avatar.
*/ */
@ -33,7 +31,7 @@ export default class Avatar extends Component {
// XXX Avatar is expected to display the whole image. // XXX Avatar is expected to display the whole image.
resizeMode = 'contain' resizeMode = 'contain'
source = {{ uri: this.props.uri }} source = {{ uri: this.props.uri }}
style = { [ styles.avatar, this.props.style ] } /> style = { this.props.style } />
); );
} }
} }

View File

@ -4,19 +4,12 @@ import { createStyleSheet } from '../../styles';
* The style of the avatar and participant view UI (components). * The style of the avatar and participant view UI (components).
*/ */
export const styles = createStyleSheet({ export const styles = createStyleSheet({
/**
* Avatar style.
*/
avatar: {
flex: 1,
width: '100%'
},
/** /**
* ParticipantView style. * ParticipantView style.
*/ */
participantView: { participantView: {
alignItems: 'stretch', alignItems: 'stretch',
flex: 1 flex: 1,
justifyContent: 'center'
} }
}); });

View File

@ -95,6 +95,7 @@ class Thumbnail extends Component {
= { audioTrack.jitsiTrack.getOriginalStream() } /> } = { audioTrack.jitsiTrack.getOriginalStream() } /> }
<ParticipantView <ParticipantView
avatarStyle = { styles.avatar }
participantId = { participantId } participantId = { participantId }
showAvatar = { participantNotInLargeVideo } showAvatar = { participantNotInLargeVideo }
showVideo = { participantNotInLargeVideo } showVideo = { participantNotInLargeVideo }

View File

@ -4,6 +4,17 @@ import { BoxModel, ColorPalette } from '../../base/styles';
* Filmstrip related styles common to both Web and native. * Filmstrip related styles common to both Web and native.
*/ */
export const styles = { export const styles = {
/**
* Avatar style.
*/
avatar: {
alignSelf: 'center',
borderRadius: 25,
flex: 0,
height: 50,
width: 50
},
/** /**
* Dominant speaker indicator style. * Dominant speaker indicator style.
*/ */