A React Native Paper egy több platformot is támogató eszköztár, amivel rengetegféle UI (user interface, azaz felhasználói felület) elemeket tudunk használni, mint gombok, inputok, stb.
Minek ez nekünk? A React Native alapból hoz nekünk egy csomó ilyen elemet beépítve, melyek tehát a react-native csomag részei. Innen kell őket importálni a használat előtt.
Azonban ezek nem igazán vannak dizájnolva. Ez a nemes feladat ránk vár valamelyik stílus készítő eszköz segítségével. A React Native Paper ezt megcsinálja nekünk és sok melót vesz ezzel le a vállunkról. Például már egy egyszerű kereső doboz is elég sok fejfájást okozna, ha mindent nekünk kellene a nulláról dizájnolni. Eltartások, árnyék, ikon, stb.
Telepítés és beállítás
Telepíteni így kell:
npm install react-native-paperBár a dokumentáció mindig azt javasolja, hogy a legfrissebbet szedjük le. Így tehát ez is egy valid telepítés lehet:
yarn add react-native-paper@5.0.0-rc.8
vagy
npm install react-native-paper@5.0.0-rc.8(És persze, ha a dokumentációt említettem, akkor művelődjünk a hivatalosból.)
Ha már a keresőről volt szó, akkor egy Searchbar használata úgy történik, hogy a React Native Paper oldalán rákeresünk, hogy „searchbar” és ő megmutatja nekünk, hogyan kell használni. A legegyszerűbb, funkció nélküli beépítés:
import * as React from 'react';
import { Searchbar } from 'react-native-paper';
//...
<Searchbar />Gomb ikonok
A gomboknál megjelenő ikonokat ebből a listából lehet kiválasztani: https://materialdesignicons.com/