ReactNativeのボタンがiosとAndroidでは挙動が違うので代替。

2021.11.18

Logging

今日はReactNative(リアクトネイティブ)でアプリを制作しながら勉強している中で、ボタンを使ってみたら・・・iosとAndroidでは挙動というか見栄えが違うのですよ、ドキュメントにもそう書いていた?。なので、ボタンじゃなくてこちらを使用するほうが良さげです。

Color of the text (iOS), or background color of the button (Android).

こちら【TouchableOpacity】などを使用してボタンを作成しないといけないみたい。こちらで作るとios、Android同じ見栄え(デザイン)になります。作ってて思うことは師というかメンターがいればもっと効率的に開発できそうです。

師匠がほしい今日此頃・・・。

React Native Tutorial #8 – Touchable Components

以上、現場からでした。

import React, { useState } from "react";
import { StyleSheet, Text, TouchableOpacity, View } from "react-native";

const App = () => {
  const [count, setCount] = useState(0);
  const onPress = () => setCount(prevCount => prevCount + 1);

  return (
    <View style={styles.container}>
      <View style={styles.countContainer}>
        <Text>Count: {count}</Text>
      </View>
      <TouchableOpacity
        style={styles.button}
        onPress={onPress}
      >
        <Text>Press Here</Text>
      </TouchableOpacity>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    paddingHorizontal: 10
  },
  button: {
    alignItems: "center",
    backgroundColor: "#DDDDDD",
    padding: 10
  },
  countContainer: {
    alignItems: "center",
    padding: 10
  }
});

export default App;

タグ

Android, background, button, color, from, import, iOS, of, OR, quot, react, ReactNative, Text, The, TouchableOpacity, useState, アプリ, こちら, こと, デザイン, ドキュメント, ネイティブ, ボタン, メンター, リアクト, , 今日, 今日此頃, 代替, 作成, 使用, 制作, 勉強, , 師匠, 挙動, 現場, 見栄え, 開発,

デザイン好きなひと必見、デザイナーメンターYOUTUBER

2020.01.22

Logging

デザイン好きなひと必見、デザイナーメンターYOUTUBER(ユーチューバー)です。メンターとは講師(師匠)のような意味合いだと思ってください。
この人、ipadでサクサクっとアプリを使いデザイン制作を得意とする人です。
観ていてなんだか簡単に制作している、それを観ると自分も出来そうな感じがします。また制作過程の解説動画はかなりありますので、いまデザインの勉強をしている方は見て損はないひとだと思います。

Procreate 使い方解説★ リアルなスタバの絵を描く!!

ちなみに自分は直属のデザイナーメンターさんが欲しいなと感じます。Illustrator(通称イラレ)の機能をまだまだ使いこなせていないです。もっと洗練したオシャレなロゴやタイトルなどが作れたらなと思います。自分もこの方( amity )の動画を観て真似たりしています。

iPadで文字をカーブさせて おしゃれなバナー&ロゴを作る!【Affinity Designer for iPad】

上記の動画を真似て作ってたのがこれ!

デザインを勉強してみたいと思った方はこちらが彼女のチェンネル登録のリンクになります。
https://www.youtube.com/channel/UCcXtyjK8wagT5LWS5bBgPPQ

タグ

-EFI, 2, , amity, com, https, illustrator, iPad, watch, www, youtube, YOUTUBER, yPlg, アプリ, いま, イラレ, かなり, これ, それ, タイトル, デザイナー, デザイン, ひと, メンター, ユーチューバー, ロゴ, 上記, , 制作, 勉強, 動画, 師匠, 得意, 必見, 意味合い, , , 機能, 洗練, 直属, 簡単, 自分, 解説, 講師, 通称, 過程,