import { Text, View, StyleSheet, Image } from 'react-native';


export default function App() {
  return (
    <View style={Stiller.Konteyner}>
        <View  style={[Stiller.Kutu, Stiller.Yuvarlatici]}>
          <Text>ADK</Text>
          <Image source={{
              uri: 'https://www.bleavesfloral.com/yuklemeler/cicek/lina-cicek-buketi-1.jpg',
            }} style={Stiller.Resim} />
        </View>
        <View  style={Stiller.Kutu}>
          <Text>ADK</Text>
          <Image source={{
              uri: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSaDxX5Md6Pr23Agv59lnGxVREnhKm9tBk_hQ&s',
            }} style={[Stiller.Resim, Stiller.Yuvarlatici]} />
        </View>
        <View  style={[Stiller.Kutu, Stiller.Yuvarlatici]}>
          <Text>ADK</Text>
          <Image source={{
              uri: 'https://reactnative.dev/docs/assets/p_cat1.png',
            }} style={Stiller.Resim} />
        </View>
    </View>
  );
}

const Stiller = StyleSheet.create ({
  Konteyner : {
    flex:1,
    alignItems: 'center',
    justifyContent : 'center'
  },
  Kutu: {
      padding: 30,
      marginBottom: 20,
      width: 50 + '%',
      height: 200,
      backgroundColor : 'green',
      display: 'flex',
      alignItems: 'center',
      justifyContent : 'center',
      color:'#ffffff',
      border:'10px solid grey',
  },
  Resim : {
    width:'100%',
    height:'100%'
  },
  Yuvarlatici : {
      borderRadius : 50+'%',
  }

});