ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-20 03:42:10 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

converting add button to floating style

Browse Source
This commit is contained in:
Nouman Tahir 2021-03-15 13:25:28 +05:00
parent 5744922f45
commit b843fc2032
2 changed files with 15 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/snippetsModal/snippetsModal.tsx
View File

@ -116,25 +116,24 @@ const SnippetsModal = ({ username, handleOnSelect }:SnippetsModalProps) => {
//renders footer with add snipept button and shows new snippet modal //renders footer with add snipept button and shows new snippet modal
const _renderListFooter = () => { const _renderFloatingButton = () => {
const _onPress = () => { const _onPress = () => {
if(editorRef.current){ if(editorRef.current){
editorRef.current.showNewModal(); editorRef.current.showNewModal();
} }
} }
return ( return (
<> <View style={styles.floatingContainer}>
<MainButton <MainButton
style={{ width: 150, marginTop:16, }} style={{ width: 150}}
onPress={_onPress} onPress={_onPress}
iconName="plus" iconName="plus"
iconType="MaterialCommunityIcons" iconType="MaterialCommunityIcons"
iconColor="white" iconColor="white"
text={intl.formatMessage({id:'snippets.btn_add'})} text={intl.formatMessage({id:'snippets.btn_add'})}
/> />
</> </View>
); );
}; };
@ -148,7 +147,6 @@ const SnippetsModal = ({ username, handleOnSelect }:SnippetsModalProps) => {
keyExtractor={(item, index) => index.toString()} keyExtractor={(item, index) => index.toString()}
renderItem={_renderItem} renderItem={_renderItem}
ListEmptyComponent={_renderEmptyContent} ListEmptyComponent={_renderEmptyContent}
ListFooterComponent={_renderListFooter}
refreshControl={ refreshControl={
<RefreshControl <RefreshControl
refreshing={isLoading} refreshing={isLoading}
@ -156,6 +154,8 @@ const SnippetsModal = ({ username, handleOnSelect }:SnippetsModalProps) => {
/> />
} }
/> />
{_renderFloatingButton()}
</View> </View>
<SnippetEditorModal <SnippetEditorModal

9
src/components/snippetsModal/snippetsModalStyles.ts
View File

@ -1,3 +1,4 @@
import { ViewStyle } from 'react-native';
import EStyleSheet from 'react-native-extended-stylesheet'; import EStyleSheet from 'react-native-extended-stylesheet';
export default EStyleSheet.create({ export default EStyleSheet.create({
@ -10,6 +11,13 @@ export default EStyleSheet.create({
flex: 3, flex: 3,
paddingHorizontal:16 paddingHorizontal:16
}, },
floatingContainer:{
position:'absolute',
bottom:0,
right:20,
justifyContent:'flex-end',
zIndex:10
} as ViewStyle,
itemWrapper: { itemWrapper: {
paddingHorizontal: 16, paddingHorizontal: 16,
paddingVertical:8, paddingVertical:8,
@ -40,4 +48,5 @@ export default EStyleSheet.create({
paddingBottom:8, paddingBottom:8,
color:'$primaryBlack' color:'$primaryBlack'
}, },
}); });