Introduction to react-native components

Introduction to react-native components

ยท

2 min read

What are we going to learn?

Some basic components that react-native offers and are a must for a newbie who is getting started with react-native development.


View:

  • A basic container component used for layout and styling, equivalent to a div in web development. View is the most fundamental component that supports layout with flexbox, style, some touch handling, and accessibility controls.

  • Views can be used in nested form like we perform nesting for div in web.

Text:

  • A basic component for displaying text on the screen, similar to a p tag in web development.

  • Text supports style, nesting, and touch handling.

NOTE: You cannot write any text inside View without using Text component.

import React from "react";
import {
    View,
    Text,
    StyleSheet,
    useColorScheme
} from 'react-native'

function AppPro():JSX.Element{
    const isDarkMode = useColorScheme() === 'dark'
    return(
        <View style={styles.container}>
            <Text style={isDarkMode ? styles.whiteText: styles.darkText}>
                Hello World!
            </Text>
        </View>
    )
}

export default AppPro;

Image:

  • This component is used for displaying images, including network images, static resources, temporary local images, and images from local disk.
import React from 'react';
import {
  View, 
  Text, 
  SafeAreaView, 
  Image,   
} from 'react-native';

function App() {
  return (
    <SafeAreaView>
      <View>
        <Text>Hello World!</Text>
      </View>
      <View>
        <Text>Let's Learn ReactNative With Hitesh!</Text>
        <Image
          source={{
            uri: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxMTEhUTExIVFhUXFx0YFRgYFxcYGBoYGBcXFx0XFxcYHSggGB0lHRcYITEhJSkrLi4vGB8zODMtNygtLisBCgoKDg0OGxAQGy0lICUtLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLf/AABEIAPUAzgMBIgACEQEDEQH/xAAcAAABBAMBAAAAAAAAAAAAAAAFAAMEBgECBwj/xABFEAABAwEFBQQHBQUIAgMBAAABAgMRAAQFEiExBkFRYZETInGBBzKhscHR8BQjQlJyFZKy4fEWJDNDVGJzooLCNFPSF//EABoBAAIDAQEAAAAAAAAAAAAAAAADAQIEBQb/xAA1EQABBAAEAwUGBQUBAAAAAAABAAIDEQQSITFBUXEFE2GBkSKhscHR8DIzNFLhFCNCcvEk/9oADAMBAAIRAxEAPwCeKM3BaLKk/fNycziJJTloMAGZ11oKKyK8sx+R2ageuv38fFe3liEjcpJHQ19/BdUu7sihK2kJSlQkQkJy8KFqvOx2hfYqAUTkFFMAn/arUHhWL5cLFhCSe9gS35lOfsBqgTXWxWKMWVlDayPl4e9cHBYFs4dJmI1ppHx8fci20VzGzLEEltXqn/1PP30Iq92w9vd2Jz1gjFPNJgHzH8VUWsGLhbG8FuxFhdTATvkjIf8AiaSD41xWKVZpVlW1YpVmlQhYpVMumxl51DY3nvRuTvPSrPtPcUhsWdgTniKYGQAgHPM69KdHh3yRl7eHqVmmxccUrY3cePAdb5qmVmiyNmrUf8o+akD40QunZh5LzanEpCEqCj3gTlmMhzAobhZXGsp9EPxsDGk5x6hGrPsy32YS5mYRJEA92SYMTBJM1R3rOe1LYGeMpA54sIFdZmqLYLvWq3qJQoIS6tclJAyUSIOmsV0sbhmnIGDc15Lj9nYtzRI57thevP8AlSdqrE21Zmk4ZUnuJMnKe8pUbyY/7VTqs23lpxOobnJCZ81Hf5AdarVYcaQZiANqHp910AXT7Na4YdpcbJs+p+z1KxWaIXBd/bPpRBwzK/0jOJ3Tp51bbbcLa32oZCUJSSophIKpGFJG/Q9aiHCvlZmbzA++n1Vp8dHBJkdyv+Op4eSoVYq4bSXI466OxZASlIEgoSCZJ0ndMUNOyVpicKfDGJ+VD8JK1xaATXGkR4+F7A5zgCeFjRAaVFLTs/aE/gKo1wSr3Copu56J7JyBr3FfKlGGRpotPotDZ43C2uBHUKKaxWTWtVCatqMbJWTtLSjgnvn/AMdP+xFB6uewNnydcjOQgeQk+8dK0YWPPM0efpqsmPl7rDvd4V66Jnb62SptobhjV4nIeyetC7h2fceUFEFLc5qOUjgjj46VYLEizWi0OLXCl4oQlRyKUJSJCdDnJzmo21V8WhsltKezQckrGZIy0P4fDWtcsbHOM8htt6AfM8OfLXdc2CaRrW4WEU6rJdpvvQ48r8NuI12tvRCUCzNRAgKjQBOiBzyE0MufZtb6C4VBsaIJHrGfdzobdlmLrqG/zKAPhqT0muiWl1pC0BTjSENpnAVAHFACTHAJxdRwqImf1LzJINBoBsPsbq07zgo2ww/iNkmrPprqdvDrqqRfNwqYU2nEFqcmAkGZEbt+tFmdilEJxOgEjvAJmDwBkTU66LR9otK3zk20nA3OWsyo+U9RUu4ny8t18+rOBocEJzJ8zE+HKrxYWFzttCTWp2G58z8kqfGYlrKui0DMaG7tm7cB8FS7Vc7iLR2AIUoxBGkHOTwy1qyMbHtgyp0qwgSmBExJB3weGRjfT2z6gt20WtWklKTwSkSf+oTQde05LLqMJ7RxSjO4JVA4zIGVUZHh4xmeN7I6DbzPimySYuY93GaygB1czv5DbTVWDZa3h1CglpLaUQO7kCogkwN27jrQe8NsHAtSW0oACiASCSQDE6gVNuhfYXepzRSgpQ/Ue4n3JqjmifEyMijAOpFnbyRhcHDJNK4ttoND5n75o4vay1H8aR4IT8Zo9sdbnni6pxwqSIAEJGZknQcI61Rav2zaBZ7GXFbwpw+H4R5gDrVcFJI+W3ONAE7lX7SiiigpjACSANBfPRTLstpctFoTMoQUJSMsslYvHMU3cLJxPuKUoy8tKZJICUqOg3ZyPKhewb2JT86kpUfMrn20dvh0NWd1QyyVH6lk5/vKrbC7PG2Vx2zH3n5LmYmPu5XQNGpyD3D4n11VLZsS7ZaXCMklRKlbgmYA5mAOlFDsj2YLgcQspk4VpISQAclEKmpLCjZLEnCPvHYwj/evTomPMVJvpfYWLDPeUAid5UrNZ8+8azsgja0ukFurMTyvWvj6LZJiZnPDIjTScjRV3WhPw25+CkbNW8PNEhtLaUnCAIgwkEmBpmajXReT1pxqSUIbSqAcJUojM/mAGWHdvqPj+z3aNylpy4y4Z9iT7K2sf93u4q0UpBV5uGE+wjpTxI72Q47NzO+XzWV0LCHuYN35W3r1OvlvzTF32m2vhS0PoShKymcKc4EyBB5b99Yuv7U4wp5dpKBmRKEHJOp0yGWUcKmXbZymwJQnJTogHm4YnySZ8BSvxQhixo/GUhXJtPzwnoaWGEMD3E3W1nVx2G/DbzTXSNdI6NjWgZt8rdGt1J1HH5UhlhsFptSO0deUgHJvdik7wmMuFQL/ALA5Z8AL6l4gdCoREczxq32q0NIcQFutoS2mcBIBxGAkxwCZgc6o20F5du6VD1R3UfpG88zM0nFMjjjqyXbXZ8ydfLbktGBklmlugGamsoochdeaGmsUjSrnBd1ZroFynsbBj34FOeZkj2RXPqNfthxVmWhShhAQhIGRjXz9T2mtWFlbG5xO9Glg7QgdM1jRtmF9Nvmg6FlJBBIIzBGRB4g1drnvJu2N9i/Bc3bsUfiTwUN4/nVIrKVEEEGCMwRqDxFLgmMR5g7jgU7F4UTjk4bEbhXC47mNntZx5pwKLa9xzSIPBUE5VJvW7GUF5+0LBKwQ2mJjuwIB9ZWQ5D21WrZf7rraULwqw/ijvE7lZHIjj/OR9ptK3FYlqKjxJn+laDPC1uVjbF2L4E/TgsLcFiXvzyPo1RrcgHgeF8fhqrbsklK7M60FhK1FXMhOFKcUcM6K3mtDFjIQcgjAg8SrKeZzJrnKVETBIkQeY4HlTr1rcWAlS1KSn1QSSBlGQ3ZUMxgbHlrWqtWl7Nc+bPm9kuzEV99Fdrns+Ow9khSQpaTizmAtRmQN+GRHKgl+2FppLdnbWFOYpXkJJVAEkHuxuTznxCMWtxAUELUkK9bCSJidY8TTbaykhQMEGQeYzmlyYljmBuXWqu+Hh9SmRYGRkrn59LLgK3J5nkL4K4baOBphlhOnwbAA9p9lU2nrTaluRjWpUaSZic6ZpeIlEshcNtFowmHMEQYdTqSepWzaZIA1JgeeVXraxQZsaWhvKUDwTn/6jrVHs7pQpKxEpIIkSJGYyoltBe32jss/UQMWUSsxiMcMhV4ZGsieOJ08tvvolYmB8s8R/wAWkk9fsBEdgXPvVp4on91Q/wD1U3be3jAhoHVWJXCEg/E/9aqNltK21Ym1FKoiRzra3WxTqgpW5ISPAD4mT51YYkDDmLj8iluwJdjBPw99gae+l0RTDbq2XQ4ClvEEARClZCQeWE0D2wX2toYs4O8YuRWQB0AJ86qbT6kkFKlJImCCQROsRpWRaF48eNWPXFJxTpM1eXGNkYW5asi/FLg7NfE8PzXlBDfC7+t9eCt22JxLs9mToSPaQhPxrbbq0BLTbSdCScuCBAEeJ9lVB21uKUFKWoqGhJzGZOR8Sa1deUqMSiqNJJMZzv5mqyYoOElD8VeivDgCwxWRTLPHUk/89F1BsJbZQVZBpAJ5QmJ6TVT2btoetq3VmCUqKZOneSkDoYquuWtwgguKIMSComYJImeBJ60yKtJjczmkDQa0qQ9lljHhzrLhV1tx96vN7Xey2p199YKlghtMAx3YGEH1lRGegqjU4+8pasS1FSuJMmm6zzytkPsihr114la8Jh3Qtp7rOnQAbAeHxSrFKsUpa1Ms9qSlObIXnrAPlW/25OoYT0FN2Z3ukVoVkGYrpRMbkGi8xi5Hid4BO54n6pO3oB/kI6Cmf2kToygeQpFnEals2QAUzI3ks3ev5n1P1UJu0rUfUR+6KctuJDeI4Z3DCKKsWcaiKHWlONfe0FAjby9yDK/9x9SgirQ9loBPAUft1lhrENYqC+mSOANHbcPufKqyNbpohsr/ANx9Sqc+pwRCj1plkuSMTitdJNTLwISAomANSdBVKt999o4Q2e6OpHE114jCIRYFg7UPosMhnMpAcaI5lW+8r6LacLSQte9SiMKffJ8qrKre8SStx0GdErKQfCaHqdQjVYk55/Oo1qcQTiwpB3nPF/4yaTKRIdQK5UnRl0YoOPWyipvS0DMOGOBUVHxKsWXStXLc6QCX3RxAXl1xR7aEC2o3KT7R1p5Fq175jflI9vzpeRvIegTO9f8AuPqU49eTyc0POqgZDtp8yAr40Nbv+1k915zWSMROhnU7stKLNIQsQQDzAg9Dr7aHKs6GseKTO8DhuEVYMZ+0egUGWQ/5H1KOWja5ZQSpRSsQQkZA6T6sRv3cKvN3nG2HUqJAGZ/CTvAP4o4jLnrXF3yFr9UpHPWP6V0P0e36wmzqs7i8KisqTigJzAyBnM5T51nnY1jLDb6ffBPhne9+rq9frxVht9qxEYct2WVaDEkwonTjUW9lYRiSZAzyqWxeCHWgR69ZQ0ZbA0XYZIWuDDxRWxkYQIBJ451upkCZra52ZTJra9yAkmkkBxGbjssj3u7zKCUAtrpJlKiAOBildNpxrwknKmnUZCDmazs9ZVG0HL1RWgN0oJ+K0i3OnVFCIJHOs02hclf6z7hTk1il/GV0sGc0DD4BOsrj65Vv226KgrXBmnhbUISVuEJA3mt8X4AvO4z89/Uok0kVuEAmq0NrLOuA2qZMZ5UVQ+rIjD1NNLHDgsocEUCMAJmg4fxqMaVveNvWUQEdDUKxLI1QqhrSglTnmsh40Ytv+D5VXbVeCTAEjPeKOPWhJZ1GlUeDopauabdXjOGzjT1nM4/Sn49KrFnlMQETuE7hyCSTWdp7YVPOGYlZBI1hPdA9lM2G1KwnckHPieR41tjbQSXFSzaAsylOBRynvEHxnIDrUZxoJJIIM6pwyPIzUyztuv8Adaakb1GY6THsozZfR+6vNaiJ3AACqukaN1YMJVWGAH8AO5MQfOAadCc9wnSI+QJroNk9HbadST9cqLN7HNj8NKM44K4iK5p2yUjMmf0mPOodqfWvKPOIn4e6uuq2ebSICRO7L4UEXskrESBnu5A8TuqO+8FPdeK5M5IMTnvjh41JsNvLK0rSMxBHD28qN7V7PrsxxGSDrHu8KrQRijOtLSHC0hwLSurOvJdZC05hQnz3iitwWRCWSojOqbsm+SypBIIBkedX25bPNnk1z3gxghvNdjvRIGO8KRK7T3RTd9eoakWdISkUJvq3gkDdvrNEL9s+SA3NKMvNCHGzGMU5dr6kFSuIzpPokYgO7QK+LWtKe6Y3GnNGY0teIFwu8FYbpMpUTvWT7qmUK2YSQxnriJ9gorWWYf3HdVuwJvDRnwCh2l04wPChm3tjHYsuFZ7IugKHETqeVCfSFbFthOBRTMZjwNZsT7huh5by8cyG53eFdbBx2wOK8x2i6p3jxKLbSXXZ02PtQgIwpEERJPKKtux9gYdsbXaLUh3Dni0rlO01g7CzWcF1SlKTJSokpGW4VW278tKckvuAclGtjlzwCu13hZHkrIblSeNYaaf3ggeFccTtRbBpaXOtODa22/6lfs+VUrxKt5Bddfbc/KelSrRZkdnOLvRpXGhthbv9QvoPlRBd43pmSpemLQaUZXHZxU7f4hB74BLqjpClE/vGpOy11m1WhKFGQBJ8BUJ5U4iTOKDNWX0aL+/gaxJqj9GlXZuF2K4robaQkJSNM6KOoAGUVGsj4w067bW0+stIPiKxgWFrGhSBrZSa1szyF5pUD51JVCQTwquUq9ppFlOtYW3G6qhfe2ryVYGWRyUZPQCo9hva8nZCmkxuOSf50wRabpZk5BStsLr7dlSAO8BKefKuGrKkKUlSTIMcCCOI3121VotLakhwJInmY5TFVP0l3GiBakACThc5yMleOUedXidkdlPFLkaCMyD7EBxztAASYGnnXTLscWlkILapqr+hex951R/EkBI4wZJ8vjXVixyqJo2yWCtuHjBjbZVVfU6Uwls0L/Y7xMkCr4Wa0LVWETeS0g5diVUrVYnlpCYSkDXnQ93ZtShClb6vSmaaU1TA0A3SXTQ2uHVVVmydkMEzv+ulb1MvYQvyHxqFXIxA/uu6ruYUAQsA5BUj0mkYG+M/A1IvdB+x2Ozxm6tMjlMn3Vvt7ZVLDIjJTiUz40QtjGK8LMj8LLZUfGI+ddfB33IC8l2lX9U/qVUvShaAbUlsaNoA6/0qmUb2tdUu1uqIOasp4aZdKGsWJxfqNrVnGSSc+GVPWUbKNSqzXfsNeDyilNmWI1xQkZ+NdVuz0fs/s9LLlmT2xgOL3zvIV7qsGEotcHbXBB4Ga6JaNvWi2W+zPqRMb8/nVs2o9ETKlMCzKDWcLmSSMsxJ1qHtf6J7OxY1vNOLC20lRxEEKgSQeFHdlVc1rqvguSMmUx5eVXb0X2bCq0PEZISB55q9woTsPs6bX2xxkBtEwBJORPwq07AMFKbS1vxJOfBQI+FIxGjK5j5rRECTfBGGnLVaQezUUD8PIcTnM1De2PWnvOWoYt5OXvNEnbM+IaYAQn/MUcieSconx40Nu66nWrSpTylLaMZFawqUpKZkKgSTiMA6ZAUkOsckws15orcbnZKCMWLgZ1FXFTZw56RXPbrur+8YxJSM0kjTPcd/nXRrCrKKQSbpPDdFzy970DSyhIAg6xlnvqNbL1tiXktJGIKRiCgMYxGICiFJSkcYzG6date0OzaXjKTBGYynXdQ2w3A8hQ9XxNWa4DUqC1S7GxacXeUhTZ0CsQJHEgzhPKaztJdmOyupA/CVAc094e6rJYbswiSSo8T8OFb3g0CkiKq7Q2iuaC7NWdDVnsjjQgYG1afmAxJPmfZVqfXiUSKpmxyj9lwEzgdUhPglR+EdK6Exd8iSYp0YNlMD2taCeSHizqImDFNFNWNTcIjlUZu7hEqp+VVbigbJ8kCQ3KgDTNptTSFFOBRI+uNHHrEEqEaUFttmBcPM06FgJOZJxE50LCq5fLyVrlIgYQI8zUGim0lmDboSPyA9SaFVw8TXfOrmvU4Ek4ZhPIKBebiVrYa3heM+AFaXK12lqddzzIQPM7utbW+EKU6fwtn40NsG0P2Wxt2kpxErBjjP9a6mDbcQK8n2if8A1SDx+amXy2zZ7+s4dQChbYQJiAokweuXnXW7NdbKBCUJGI4sgK8xbZbVLt1pD5TgwgBABzEGZnjNSrR6RLxXg+/w4BAwgCfGda15xZWal6LF4ICnxiSMA5cJqnXRtg1+zFuvPgrClzmJMLUAAPACuEv3vaFlalPOHtPXOIjF4xlUvZu4F2p1KYUEHVUZVV8wYMxVHubG0ucaC7he+393pQ1aQ+FuIGSEmVGRBGH50A2v9KFhfsrjaErWtaSMJSQASN5O7wrnlr2OdNoW0yJSn8StKCXrdblnXgcEHdwNLZiWv0BS454pCA12tXSvvoftSGe3cWr1gExxyPzNW6z2VLb7Sk/5iFo8QlSXEexxY8q5RsysBJmfXHwrqLtrHZMrGZZeQFcQHAUdO8P3RVcRC7ug/fX0v+V04nsyFo0On/VcW7ClQjPyNMquJvh1qTd1qg0xfl5FKDh1OQHOsNCk4HVNpYQMk5kcBlUmwGT76r7F4os4Mupx6qKhKZ8s99R7Ptu2VYUkKUr8oIHlNTkNWozi6VztjBBHE+6glsvJTSu+O7MYhp58KG3ltMgyFqUkpAlIMHPif50Ie2ybKIKZAyg5yBI19tTkJ1CO8A3XRbDbkLTIpp9U1z3ZW/kLdwNSkGZQdB+n5Ve2zlJqjrGhUAg6hCNgG+++hWYFqJHQE+xNdKWJTlVB2HQAu2qgQX8jlP8AhoJE8Jq3IfMZGtcegtLLc1UdkQXkmt5kZUKW8Tqa07cjQ0zMo7glSrYo4kyar14WkB0g8anKdJUM99Vm/cXbqjj8BT8OLJ6KJ2ZA1R9oLV2jmIaBIHSfnQynHZ303XCxLcszh4r1eBN4aM+AVV26vcNNqazxLTlVZ2lcwWSys8sR6fzox6QwFONIjvEjPlNAdspK0GDAGEcK6sH5Tei8pjx/65P9ihVy2Ht3kNTGI5+FXq33NYkOIs3ZnGSJVGXWufWK1KaWlxBhSTIq0Xltwt1vD2SQv8+/xFIxDJHOGXbrWvNcbGRTve3Jt1qjzV4/Z7OJdnLADYRIXFSbKjAlkMYQ2DC/CuX2jbC1LRgKxERIGcULRebyU4Q6sJ4YjWcYJ5GpCxDsuUj2nD3nzXZUXzZ0vOtlaQrXWucekG1pcfBS4FQIy0FVdxZJkmTzputEOEETg61sw/ZzYZA8OtELFbAhJEGcQOXKPlR279rSgPoUnEh5KUzMFCk+q4OME6VUqVbi8luU7LojQ2F6Rui1h1lt0H1kgnxIz9tVP0gXm60pGE5GfHyoT6OdpvujZ1HvJP3eeoO4c9etFdpLQl9g4gMSTIO8QTNc7JldqtefM1VVh7GfvnAkqEAKIBM8vOrJcWyLqFY0tuK1I7pHETnzqZd92We02ZIUlBVGfjR66X3bMkBJUUiIBUoiBuBnf1yphN7qWM4tq/FBbfsi6U41jADMqcUkDJJVuz0B3UDsuz6nHOyQO4BKnM94mEgwZ3SeGlXS8LaHVJ7QgJToCZE55wT62ZEjdTtltjaAVJ0yiYE8+tVJoaK5YAPaq+QVJ2Tur7PbXSs+oFAeHH21cnr6CUKz0JHy61Tr3tX99xAiFpzA+udQbU6q0Ops7ZnEqVEbkgQSfCY/rUFpJ1SQ6hop9k2vesgLqUFaHFKWQQcMk5HEBwij2ynpWQ45gtKQ2DosGUj9XCh7TamRhEYkd39QAkT5RNZcSy4B2jKTI/EkHoRW8D2aGyyZiHXxXVWbQlYxIUFA6EaVlVUC4rw+zJwNJGAn1SVED9OeQo8xtSD67ZH6SD7DFJMbguhHimEalWBCcx40NvRiXFH60p6x3yysiFiZ0OR9tbW9BKyQCRxp+H0JtKxjw4CiqteqIV5fE1ColfqSFpkR3R71UNri4v8APf1Xqezv0sfQKp7UMTaEr/KkfGqPfF7Kd7hjClRiug7QkF5tB/GUJPgpcV0xr0dXbhH91bOW9Irp4UnugvLdo0MU/qvLdKvU3/8AO7t/0jX7orU+j+7v9K3+6KbSx5l5bpV6hOwV3f6Vv90Vj+wt3/6Vv90UUpzLzpdthZWklx8IPCpybqscZ2r3V34bD2D/AEzf7oqF/Z27e27D7O3jjFGEaaVO3BGZcAvKxMITLb2M8IoVXqBzY+wJBJs7QA1JAiq1e1isIlLVmbjeopHsHxoItGZceuK433yFNjCkHNw5ARw3qPIUTvd55pRQ6cWUBYGSgdCeB5VdrTaJGFIGEDKMhkNw4VNstmatTKrO4kfmxD1oUEDXlh99UlAa3MVMZLnUFWtm7cSgAKA6cutFr3s61pHZvROZ1948art9bKv2JRcaCnGZ01UkDPMDUZVDRtCcIziIHXP3UnLm9pqcHVo5H7DcigQXX5ngIiOZ8KsT96sNoShJnXMxOQOeVcxRfy8RJUc8o+vrKkHnbQrCyhSjyG/TPoKO7P8Akp7wVTU/fF743wpPkBqZIyroewGz5aQX3RDro0/IiZCfE6mhuxexPZEPWkJLmqUahBMGTxV8zXR2EgDPQUmWQH2Wq0bOJVHvvJ5zkU/wIqCskpCge8IPWt71teN1ahvVl4GAn2RWjC8ymcoid+X9K3xNpgHgsUhtxKRdyC92ihlrxFYQ+oKKZz/DMQR40024QojKDrwyrNoalEjVJ9nCrqqmi1ymeeeuVTrDfLqD92tQ3wDl0UIqv2G096DoqlaklBKknTPyoVla37wW/wB5frAYdI0z086aqJdjwWjEN5mpdcPEfmu6r2/Z/wClj6Kn7S2kItrBVOFOBZj/AGqUfhXT0ekuxkAAq/dNcZ9Iaz9pAG9lP8S6A3Mlfab66ETiIhXJeZx7Q7FyXzXoU+kSzf7ulMu+kazDcvpXJUzwpt1Z4VHfOWbumrqTnpNs/wCVfSnbHt+y6QEoVJ0yrj6JUYwmrBclkcCwUJMijvXWgxtC67+1z/8AWaivXslJxlqDpOU1VV2m1KOa8IGp+VK22g4ZJJjrWpotZzopF83ytwmckjRI+POgTjpKSSfL61ra3rIQOJM+ymbQnuAaU0BUWiVd0E555+BrN12vsnUqJ7o7q/0mO95ZHrWy2+7UQnRQ1Hu/lVXtDmlpVmuym10hTQUJ1B6UDt+zdnc9dhB3yBB6ihNxX0pnues3OQ3oHAcquVhtjbolJ1rlOY5hrZb2uDgqp/ZeygiGRlp9b6M3bd6WxCEBI5CKKv2Ya51hpEVU2d1bZbtM0B2nvsJBZQZJEKPvH14VttDtAEgoQRzI3cpG+qb60qVHjvngBWqCCzmckSygCgt2RvI8OZ+vhTrIzOXhWGU6HyHICnWsiZ1rcsa1eQCflWGV/KnVIBy4Dr4U0pOenhFBQoNpQUknhr9edSVnEgL13Kre0JChP9ajWFXrIOo5cd9QpRPZY/dKH5XFAeEJPxoxQvZ9EIX/AMh/hRROuJiPzXdV7rs/9LH/AKhVfaS7Qt7H/sCehUfjUNiwpTuq1rsKnncKdwE9TU7+yM5lRFaI2Oc0ELzuOeBiXg81UEJFaPRwq4HY7gutV7IK0x+yriJyyZ2ofsEwyHip6BA7s6Z1dL3vNlAwspSVHVUZD5mgVm2f7PMkEAUMcfIMHQ6HnwNaYW6arPK7knFrKpJI5VFvB3IAQM41zrdK93PSh9oeKnCnWCI5VpSVreq4UhPhTtq/D7vo1FtasTw5VNtCCVDpQhZ3RxpgtToallI6fWlaAZxn1oQhrzJGYMGnrPb1t5ifGDO7X21Iea3f061DCRpMcc6hwB0KkEjZE/7TWg5AgeQn2zUS0W15wd5SjI0JnzjSmuxPE9B8qQa/nJP9PZVWsaNgpLidyoqESe8rET0HTIVJjMfQA5VotQTp5505Z8z9e+rBVUkngN1NJIk/LLnW8fWtYPShC2I8IifoU3u+opyd8/XSsFJ66VCE2hW7dUG091QWOMH6FTFePz67qaeTiBGeeX86FKNXP/hk8VT7BU2hOzLhLRB1Ssp6BPzotXFn/Nd1Xuuz/wBLH0CBXltIuyWjupBlsHPxVUhn0kqOrQ61VdvLaEWhKSmfu0n/ALLqupvNG9JrVHnyCl5zHZP6l9811yzekAKIT2Jk5AAipNs25ZbVgKVEgd6M45Vzm6LW22yu0kH8jc/mO/64GgyLa2SSVGSZz4mmZpANVjphK66jbBm0BTbYViicxGQiaH2kBQI+vGqzsjZocUvcUQPMj5VYH3I+NaYSS2ys8tZtE1Y3N51HdPz86iuHDaRzn2Ca0W9gcgnI+3gaZvdZStl0aBYCvBXdJ8ppiWpDMKfOfP6mpqj3v5VFsI+9Xx/nUr8fz4VKE+nn9TxrNlsinXEtp1OWfvrLqp+XhRC5nezJd4ZUuV+RpKvGzO4BYvm41sQSQpJykCMzuNV60Ig6+73Vd7dbO3YcA3DF0zqlvmQdMqpBKXtspuJjDH0E0HOn10pt5f0a3bMif5Vq8w5hx9mrB+aDh604kDdIAtR0CT8qmNJAER8eVQ7GoFRyqXlnE/XGgKE9HnWuITy59K1ndurVR05UFCdKiN314VoVcfb8q1KufxptR+vrdUIW6o8PPw3UytUcePCtirTKmCJ3/KhSjtxn7s5R3zujcKIUPuP/AAz+o+5NEa48/wCY7qvddnfpY+i5p6Sf/lJ/4k/xKqpVbPSSf70n/iT711VJrdCP7YXl+0CP6qTqj20BwM2dkaBGM+J/qetAkijW0qpLK9ymxHl/Wg6VU1YwQum7MiEeKaJPGcqF3GqG0+FSH3T9e+ms2SHOHNRbfZ8ScM5jNB58KjNWrG0QrVIwuJ3jLUe+prqwqRkDQy1AhWNMYwIWkmAtPnvqxUZhzRCw2iHMjONIPidcuvsqfZnRKjG+M+XCaqbFrCQCDkhY8QhR38Ikij7VoGKJ0z8yaApJHNFWklxaUJ1Jj699WO1tNtow6AZR8632Yu0JSHT6yxI5J/nRd8TlE1zMTJnNDYLfAwNFlBriUlQKIyM6A6eNAr6upTCyMyg+qsb/AB4GrwgYRlToeEQQDxqkUhjTJmNkC5a2OzOJfqjdxqyXNfyFEJOQOXKit/bMtupxN9xR1T+E/KqJaLu+zpUVKIzgAjfwmh73yuTIu5iZujm1N1stlLjMJxnvJGk6yBQLGATUMW0uEYlTGmelOBzLdy+jXRja4NAK5cr2OeS1PFcT9e2tseR4cf6aVH7bnlWQ9nkavSXmHNOExnu3fyptxym3XhG7p9RUd1wZfP6ihTY5p5bhnP8Al0rRTnl091R3HgR9e+mVveB84qCpBHNW3Z0/cq/Wf4U0UoNsoqWVf8h/hTRmuRN+Y7qvd9n/AKWP/ULXsEqIxBPioDLzinxdCfyt7sPd9aU44Hd4cY1FYsx7ycknPRRhPmeFTVOKGMkJyWdSokLAgkHf58BQ2kyVzg6m1t4bk0PFQmrtCk4glEDFAw/lSFGMoGR3kU2q7wJlmI17mnjllUxba0hKJEYzvOSiESFeEDqa2U+vNagBJXmZnvwF5f8Alv51NIzm7FEE6e/4/wDLOhhGzEA9zIGCQnKemVO/YVRPZnUD1d5mPcanWi0OTkk5qUU5HEBjxZjxqMl9QEhuAVAyMfrDFoZ/3HKih4qGPkc26H3p4Vx/hQ1NgGCmCOIrGBPAdBTlpJKiSnCeERHlWlVWhosC1r2afyjoKzgTwHSs0qhWyhbh0jQnrWe3P5j1NN0qEZQt+2P5j1NLtTxPWtKVCKC37U8T1NaqM65+NYpUIpYgcB0rPkOlKlQiljLgOlZ6UqVCKS6ViOQ6VmlRSKWI5DpSgcB0rNKikUsgVisisUIWali2nE4YMqme8Y+9CgZG+JypUqsFBYHbrS1WnHujvFRzmVKAk8h3dOZpz9pKnHAkJT5nGHSo8yoe2s0qtaWIWEVW1/H+AsC3wAAnICMzJ9fHqRGvL250vtxGcd7SZjLtMfkZ3/1pUqmzSh2HjD6A4j5qM+uTiAgZZeAjdA3cKapUqoU5rQ0UEqVKlUKUqVKlQhKlSpUISpUqVCEqVKlQhKlSpUISpUqVCEqVKlQhbClSpVChf//Z',
          }}
          style={{width: 200, height:200}}></Image>
      </View>
    </SafeAreaView>
  );
}

export default App;

TextInput:

  • A basic input component for receiving text input from the user.

ScrollView:

  • A component that provides a scrolling container, allows the user to scroll through a list of components.

SafeAreaView:

  • renders nested content and automatically applies padding to reflect the portion of the view that is not covered by navigation bars, tab bars, toolbars, notches, and other ancestor views.

That is it for this one, thank you for reading ๐Ÿ™ and happy learning โœŒ๏ธ


Connect with author

LinkedIn
Twitter
Hashnode

Did you find this article valuable?

Support Moeen's Blog by becoming a sponsor. Any amount is appreciated!

ย