メインカテゴリーを選択しなおす
【Hello World】TypeScript + React Native for Web + React Navigation + Webpack
今度はTypeScript + React Native for Web + React Navigation + webpack + github pages templateを作ってみました。
【Hello World】TypeScript + React Native for Web + Webpack
今度はTypeScript + React Native for Web + webpack + github pages templateを作ってみました。
React Nativeでnode_modules/のコードを修正したい
はじめに React Nativeを使っていると依存パッケージのバグや、特定の処理をカスタマイズしたいことがたまにあるのでメモ ただし、あくまで応急処理的な使い方に留めよう(自戒) 手順 1. パッチ当てに必要なパッケージのインストール $ npm i --save-dev patch-package postinstall-postinstall 2. 対象のファイルを修正する ex. node_modules/<package name>/<file name> 3. パッチを適用 $ npx patch-package <package name> patchesディレクトリが作成され、…
ReactNativeのTextInputに指定できるkeyboardTypeの一覧
毎回「テンキーレイアウトって何がどう違うんだっけ・・・?」ってなって実機で確認してる記憶喪失だから画像と一緒にまとめとく 検証環境 デバイス OS version キーボード iPhone 14 iOS 16.2 標準キーボード TORQUE 5G Android 12 Gboard keyboardType一覧 keyboardType iOS Android default email-address numeric phone-pad number-pad decimal-pad ascii-capable numbers-and-punctuation url name-phone-p…
検証環境 $ react-native -v react-native-cli: 2.0.1 react-native: 0.67.3 iOS ios/{project}/AppDelegate.mを以下のように修正する @implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { // 省略 // ↓追加 if (@available(iOS 13, *)) { self.win…
はじめに アプリがフォアグラウンドにあるタイミングで特定の処理を実施したかった 検証環境 $ react-native -v react-native-cli: 2.0.1 react-native: 0.67.3 コード import React from 'react'; import { AppState } from 'react-native'; class App extends React.Component { componentDidMount() { AppState.addEventListener('change', () => { if (AppState.curre…
1. 必要なパッケージのインストール $ npm i react-native-svg 2. SVGアイコンとなるコンポーネントファイルの作成 import React from 'react'; import { View } from 'react-native'; import Svg, { Polygon, Line } from 'react-native-svg'; const AlertOctagon = (props) => ( <View> <Svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke={…