Background with two colors - React Native

Question

Is there a way to have a background with two colors as follows: Two colors I tried expos Linear Gradient, but that's Gradient. I'm not sure how to put two colors in the main View tag as background ? Any suggestions?

Answer 1

If the dimensions of the view doesn't get you anywhere, try to manipulate its borders, for example, try this code:

import React, { Component } from 'react'
import { View, Dimensions } from 'react-native'

const { width: SCREEN_WIDTH, height: SCREEN_HEIGHT } = Dimensions.get('window')

class App extends Component {
    render() {
        return (
            <View style={{ flex: 1 }}>
                <View
                    width: SCREEN_WIDTH,
                    height: 0,
                    borderTopColor: "blue",
                    borderTopWidth: SCREEN_HEIGHT / 2,
                    borderRightWidth: SCREEN_WIDTH,
                    borderRightColor: 'transparent'
                />
            </View>
        )
    }
}

export default App

And it gives you:

Off Topic

I still don't understand why people dislike questions like this. Yes there's no code posted, but it doesn't mean he didn't try anything. Maybe he did, but none of the methods he tried was anywhere near the answer, then why should he post the code up here to make the question lengthy, just to prove that he did try? And, even if he didn't try much, maybe it's because he had no clue what to try, isn't that a possibility?

There are many questions without any code posted but got hundreds of upvotes, such as "How to remove an element from an array in JavaScript?". Really? I honestly think if you even read the documentation and tried some methods such as .splice, .reduce, .unshift, you would've figured that out without having to ask it here on SO. Those questions were popular because they made a lot of beginners (including me) lives easier, not because those questions showed that whoever asked it made a great amount of effort. And this question certainly is a good one in that sense. (But maybe he should change the title of the question to make it more specific, because it would benefit others when they goole it)