9 Şubat 2021 Salı

Expo AppLoading and Fonts

In cmd:

expo install expo-font

expo install expo-app-loading

import React, { useState } from "react";
import { StyleSheetTextView } from "react-native";
import * as Font from "expo-font";
import  AppLoading from "expo-app-loading";

const fetchFonts = () => {
  return Font.loadAsync({
    "open-sans": require("./assets/fonts/OpenSans-Regular.ttf"),
    "open-sans-bold": require("./assets/fonts/OpenSans-Bold.ttf")
  });
};

export default function App() {
  const [fontsLoadedsetFontsLoaded] = useState(false);

  if (!fontsLoaded) {
    return (
      <AppLoading
        startAsync={fetchFonts}
        onFinish={() => setFontsLoaded(true)}
        onError={console.log("Hata geçekleşti")}
      />
    );
  }


  return (
    <View style={styles.screen}>
      <Text style={styles.text}>
        Open up App.js to start working on your app!
      </Text>
    </View>
  );
}

const styles = StyleSheet.create({
  screen: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
  },
  text: {
    fontFamily: "open-sans-bold",
    fontSize: 18,
  },
});

17 Ocak 2021 Pazar

Could not initialize class org.codehaus.groovy.runtime.InvokerHelper Error

React Native için;

Change the value of "distributionUrl" to the newest gradle version in graddle.wrapper file.

To do that

go to: ..\ProjectDirectory\android\gradle\wrapper

open: gradle-wrapper.properties file for editing

go to: https://services.gradle.org/distributions/ and find out the latest version number. In my case it is 6.8

change the line: 

distributionUrl=https\://services.gradle.org/distributions/gradle-6.2-all.zip

like so

distributionUrl=https\://services.gradle.org/distributions/gradle-6.8-all.zip


24 Aralık 2020 Perşembe


 import React, { useState } from 'react'

import { ViewTextButton } from 'react-native'

const randomDiceRoll = () => Math.floor(Math.random() * 6) + 1

export default function App() {
  const [diceRolls, setDiceRolls] = useState([])

  return (
    <View>
      <Button
        title="Roll dice!"
        onPress={() => {
          setDiceRolls(() => [...diceRolls, randomDiceRoll()])
        }}
      />
        <Text>
          {diceRolls}
        </Text>
      {diceRolls.map((diceRoll, index) => (
        <Text style={{ fontSize: 24 }} key={index}>
          {diceRoll}
        </Text>
      ))}
    </View>
  )
}

 

import React, {useState} from 'react';
import { ViewTextTextInputButtonfrom 'react-native';

const veri = [
  { id: 'a', isim: 'Umut' },
  { id: 'b', isim: 'Kerem' },
  { id: 'c', isim: 'Salih' },
]

export default function App(){
  return(
    <View>      
      {
        veri.map((item) =>(
          <Text key={item.id}>{item.isim}</Text>)
        )
      }
    </View>
  );
}

 

import React, {useState} from 'react';
import { ViewTextTextInputButtonfrom 'react-native';

export default function App(){
  const [metin, setMetin] = useState("");

  return(
    <View>
      <TextInput
        value={metin}
        placeholder="Doldur"
        onChangeText={(metin)=>(setMetin(metin))}
      />
      <Text>Yazılan:{metin}</Text>
    </View>
  );
}


 

import React, {useState} from 'react';
import { ViewButtonfrom 'react-native';


function SayarButon({baslik, metod}){
  
  return(
    <Button title={baslik} onPress={metod}></Button>
  );
}

export default function App(){
  const [sayac, setSayac] = useState(0);

  return(
    <View>
      <SayarButon baslik={"Bas: " + sayac} metod={()=>( setSayac(sayac + 1) )}/>
    </View>
  );  
}

23 Aralık 2020 Çarşamba



import React from 'react';
import { ViewButtonText } from 'react-native';

function Dugme({baslik, renk}){
  return(
    <>
      <Button title={baslik} color={renk}></Button>
    </>
  )
}

function Yazi(gelen){
  return(
    <>
      <Text>{gelen}</Text>
    </>
  )
}

export default function App(){
  return (
    <View>
      <Dugme baslik="Deneme" renk="red"/>
      {Yazi("Şemsi Paşa Pasajı")}
    </View>
  )
}