Search code examples
react-nativestylesheet

In React Native, how do I align image to the right of a view?

I'm trying to get an image to be positioned to the right of a view in React Native. I need to get something that looks like the following:

enter image description here

The following is what my stylesheet looks like. I am nervous about using absolute positioning since I'm using a calculated marginBottom and it might look different on different screen sizes:

    gamesBar: {
        marginBottom: heightWindow * .1,
        textAlign: 'center',
        fontSize: 30,
        backgroundColor: 'seagreen',
        padding: 50,
        color: 'white',
    },
Solution

  • If you put it within the same View as the image, and use position absolute, then it will be relative to the image position. Just set the parent view flex accordingly. An alternative is to just put the parent view of the text and the image to be flex-direction: 'row' and then set the image to be justified to flex-end.