CODEWITHSUNDEEP
javascriptnode.jsreact-native
Muhammad Suleman
Muhammad Suleman

Reputation: 67

How to add Background Image in React Native using Nativebase.io Library

How to add Background Image in React Native using Nativebase.io Library.

I have a screen where I want to add a background image and all other components of the screen are on the center of the background image.

Upvotes: 1

Views: 998

Answers (1)

MarioG8
MarioG8

Reputation: 5921

Here You have my proposal, example. You can check it out, try it out here (basic - complete the code as below).

import React from "react"
import { Image, Center, NativeBaseProvider } from "native-base"
export function Example() {
  return (
    <Image
      source={{
        uri: "https://wallpaperaccess.com/full/317501.jpg",
      }}
      alt="Alternate Text"
      size="100%"
      resizeMode="cover"
    />
  )
}

export default () => {
  return (
    <NativeBaseProvider>
      <Center flex={1} px="0">
        <Example />
      </Center>
    </NativeBaseProvider>
  )
}

Upvotes: 1

Related Questions