search

folofse / androw

Shadows in React Native for Android
97 stars 16 forks source link

TouchableOpacity not working #3

Closed ydv0121 closed 5 years ago

ydv0121 commented 5 years ago

hello,

i want to set shadow at the bottom of the header only, but can't able to set i am using Native-Base's header component please see attachment what i exactly want

Screenshot 2019-05-08 at 2 58 03 PM
ydv0121 commented 5 years ago

is there any solution?

folofse commented 5 years ago

I made a simple test and it worked, so I'm not sure what problem you experiencing.

import React, { Component } from "react";
import {StyleSheet} from "react-native";
import { Container, Header, Left, Body, Right, Button, Icon, Title } from "native-base";

import Androw from 'react-native-androw';

export default class App extends Component {
    render() {
        return (
            <Container>
                <Androw style={styles.shadow}>
                    <Header>
                        <Left>
                            <Button transparent>
                                <Icon name='arrow-back' />
                            </Button>
                        </Left>
                        <Body>
                            <Title>Header</Title>
                        </Body>
                        <Right>
                            <Button transparent>
                                <Icon name='menu' />
                            </Button>
                        </Right>
                    </Header>
                </Androw>
            </Container>
        );
    }
}
const styles = StyleSheet.create({
    shadow: {
        shadowColor: "#0000ff",
        shadowOpacity: .3,
        shadowRadius: 20,
        shadowOffset: {
            width: 0,
            height: 20,
        }
    }
});

Screenshot_1557393214

ydv0121 commented 5 years ago

yes it's worked.. actually i used header as a componet that's why i had some problem.. it's worked

ydv0121 commented 5 years ago

can you please check TouchableOpacity is not working inside

when we use here is my piece of code

` <Androw style={Platform.OS == 'android'?styles.shadowHeader:{zIndex:1}}> <Header style={styles.header} androidStatusBarColor="#eeeeee" backgroundColor={theme.white} > <TouchableOpacity style={{justifyContent:'center',top:2}} onPress={() => Actions.pop()}>

<Text style={styles.headerTitleText}>Login</Text>
`
ydv0121 commented 5 years ago

it's worked need to assign more width to