how to make translucent buttons over a image in react-native using native-base?

Question

I was trying to make buttons as shown in the screenshot.but can't figure out how can i make them look translucent.

import React, { Component } from 'react';
import {Image} from 'react-native';
import {Button, Content} from 'native-base';

export default class AppBody extends Component {
    render() {
        return (
            <Content>

                <Image source={require('./img/bg3.jpg')} style={{ width: 360, height: 509 }}>




                </Image>
            </Content>
        );
    }
};

try this: https://stackoverflow.com/questions/31336569/how-to-set-background-color-of-view-transparent — Ankit Aggarwal, Jun 16 '17 at 17:18
Possible duplicate of [How to set background color of view transparent in React Native](https://stackoverflow.com/questions/31336569/how-to-set-background-color-of-view-transparent-in-react-native) — Ronan Boiteau, Oct 23 '18 at 09:42

score 1 · Accepted Answer · answered Jun 17 '17 at 18:38

Use rgba value for the backgroundColoras follows:

backgroundColor: 'rgba(52, 52, 52, 0.8)'

This sets it to a grey color with 80% opacity, which is derived from the opacity decimal, 0.8. This value can be anything from 0.0 to 1.0.

Copied from this answer.

how to make translucent buttons over a image in react-native using native-base?

1 Answers1