Image(assets)

import React from 'react';
import { StyleSheet, Text, View, Image } from 'react-native';
//이렇게 상단에 가져와 사용할 이미지를 불러옵니다
import favicon from "./assets/favicon.png"

 

 **    "./assets/favicon.png"   이거는 상대주소 

 

export default function App() {
  return (
    <View style={styles.container}>
{/*이미지 태그 soruce 부분에 가져온 미지 이름을 넣습니다 */}
      <Image 
        source={favicon}
// 사용설명서에 나와 있는 resizeMode 속성 값을 그대로 넣어 적용합니다
        resizeMode={"repeat"}

 

 

이미지를 어떻게 표현할껀지. 정하는거

      **   resizeMode={"repeat"}     실제이미지 그대로 반복해서 가득 메우는거 

      **   resizeMode={"cover"}    넘치게

      **   resizeMode={"contain"}   이미지 사이즈 그래도 화면상에서 볼 수 있음

        style={styles.imageStyle}
      />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    //혹시 미리 궁금하신 분들을 위해 언급하자면,
    //justifyContent와 alignContent는 영역 안에 있는 콘텐츠들을 정렬합니다
    justifyContent:"center",
    alignContent:"center"
  },
  imageStyle: {
    width:"100%",
    height:"100%",
    alignItems:"center",
    justifyContent:"center"
  }
});

 

 

 

빨간색은 내가 메모한것.  

 

https://reactnative.dev/docs/image#docsNav

Image · React Native