Devy Ferdiansyah, M. Kom

Kumpulan BLOG dan VLOG Pribadi Koe

Membuat Style Dengan Prop

1 min read

Bedanya React Native dengan Pemrograman PHP atau HTML adalah, CSS nya atau stylenya tidaklah menggunakan CSS, akan tetapi menggunakan perintah javascript. Semua dimasukkan kedalam sebuah component lalu di panggil dengan menggunakan prop dengan bentk style CSS.

Nama Style, baik itu TAG nya, Atributnya, maupun nilai/value nya sama dengan kalo kita menggunakan CSS di web, hanya saja kalau di react native biasanya atribut dari suatu objeknya di buat dengan bahasa sendiri, seperti misalkan kalau kita mau merubah warna latar belakang, kalo di CSS pakai perintah atribut “background-color” sedangkan di React Native boleh bebas seperti halnya kita membuat nama Component atau Fungsi seperti “backgroundColor”.

berikut adalah contoh penggunaaan style di react native :

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

const styles = StyleSheet.create({
  bigBlue: {
    color: 'blue',
    fontWeight: 'bold',
    fontSize: 30,
  },
  red: {
    color: 'red',
  },
  green: {
    color: 'green',
  },
});

export default class LotsOfStyles extends Component {
  render() {
    return (
      <View>
        <Text style={styles.red}>Warna Merah</Text>
        <Text style={styles.bigBlue}>Warna Biru Besar</Text>
        <Text style={[styles.bigBlue, styles.red]}>Warna Merah Besar</Text>
        <Text style={[styles.bigBlue, styles.green]}>Warna Hijau Besar</Text>
      </View>
    );
  }
}
Simpan App.js diatas lalu lihat tampilan dihandphone kalian, maka akan tampil seperti berikut:
Selamat Mencoba…

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *