post button redesign

This commit is contained in:
u-e 2018-12-21 12:21:03 +03:00
parent 9bc30d4262
commit 57b6015808
4 changed files with 34 additions and 29 deletions

View File

@ -36,8 +36,12 @@ class IconView extends PureComponent {
};
_getIcon = () => {
const { iconType, children } = this.props;
const name = this._getIconName();
const { iconType, children, name } = this.props;
let _name = name;
if (iconType !== 'MaterialIcons') {
_name = this._getIconName();
}
switch (iconType) {
case 'Feather':
@ -52,12 +56,12 @@ class IconView extends PureComponent {
return <MaterialIcons {...this.props}>{children}</MaterialIcons>;
case 'MaterialCommunityIcons':
return (
<MaterialCommunityIcons name={name} {...this.props}>
<MaterialCommunityIcons name={_name} {...this.props}>
{children}
</MaterialCommunityIcons>
);
default:
return <Ionicons name {...this.props} />;
return <Ionicons name={_name} {...this.props} />;
}
};

View File

@ -125,8 +125,8 @@ class PostButtonView extends Component {
left: firstX,
top: firstY,
}}
icon="video-camera"
onPress={() => handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'camera')}
icon="create"
onPress={() => handleSubButtonPress(ROUTES.SCREENS.EDITOR)}
/>
<SubPostButton
size={SIZE}
@ -134,8 +134,8 @@ class PostButtonView extends Component {
left: secondX,
top: secondY,
}}
icon="pencil"
onPress={() => handleSubButtonPress(ROUTES.SCREENS.EDITOR)}
icon="camera-alt"
onPress={() => handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'image')}
/>
<SubPostButton
size={SIZE}
@ -143,11 +143,14 @@ class PostButtonView extends Component {
left: thirdX,
top: thirdY,
}}
icon="camera"
onPress={() => handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'image')}
icon="videocam"
onPress={() => handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'camera')}
/>
<TouchableOpacity
onPress={() => (Platform.OS === 'ios' ? this._toggleView() : handleButtonCollapse(null, Platform.OS === 'android'))}
onPress={() => (Platform.OS === 'ios'
? this._toggleView()
: handleButtonCollapse(null, Platform.OS === 'android'))
}
activeOpacity={1}
>
<Animated.View
@ -161,7 +164,7 @@ class PostButtonView extends Component {
},
]}
>
<Icon name="plus" size={22} iconType="FontAwesome" color="#F8F8F8" />
<Icon name="add" size={24} iconType="MaterialIcons" color="#F8F8F8" />
</Animated.View>
</TouchableOpacity>
</View>

View File

@ -98,8 +98,6 @@ class PostButtonsForAndroid extends Component {
action,
},
});
// navigation.navigate(route);
};
render() {
@ -141,8 +139,8 @@ class PostButtonsForAndroid extends Component {
top: firstY,
position: 'relative',
}}
icon="video-camera"
onPress={() => this._handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'camera')}
icon="create"
onPress={() => this._handleSubButtonPress(ROUTES.SCREENS.EDITOR)}
/>
<SubPostButton
size={SIZE}
@ -151,8 +149,8 @@ class PostButtonsForAndroid extends Component {
top: secondY,
position: 'relative',
}}
icon="pencil"
onPress={() => this._handleSubButtonPress(ROUTES.SCREENS.EDITOR)}
icon="camera-alt"
onPress={() => this._handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'image')}
/>
<SubPostButton
size={SIZE}
@ -161,8 +159,8 @@ class PostButtonsForAndroid extends Component {
top: thirdY,
position: 'relative',
}}
icon="camera"
onPress={() => this._handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'image')}
icon="videocam"
onPress={() => this._handleSubButtonPress(ROUTES.SCREENS.EDITOR, 'camera')}
/>
</View>
);

View File

@ -1,18 +1,18 @@
import React from 'react';
import { Animated, TouchableOpacity } from 'react-native';
import Icon from 'react-native-vector-icons/FontAwesome';
import { Icon } from '../../icon';
// Styles
import styles from './postButtonStyles';
/* Props
* ------------------------------------------------
* @prop { type } size - Description....
* @prop { type } onPress - Description....
* @prop { type } style - Description....
* @prop { type } icon - Description....
*
*/
* ------------------------------------------------
* @prop { type } size - Description....
* @prop { type } onPress - Description....
* @prop { type } style - Description....
* @prop { type } icon - Description....
*
*/
const SubPostButton = ({
style, icon, onPress, size,
@ -36,7 +36,7 @@ const SubPostButton = ({
},
]}
>
<Icon name={icon} size={14} color="#F8F8F8" />
<Icon name={icon} iconType="MaterialIcons" size={16} color="#F8F8F8" />
</TouchableOpacity>
</Animated.View>
);