メインコンテンツへスキップ

Button

あらゆるプラットフォームで適切にレンダリングされるはずの基本的なボタンコンポーネント。最小限のカスタマイズレベルをサポートします。

このボタンがアプリに適さない場合は、Pressable を使用して独自のボタンを作成できます。参考にするには、Button コンポーネントのソースコード をご覧ください。

tsx
<Button
  onPress={onPressLearnMore}
  title="Learn More"
  color="#841584"
  accessibilityLabel="Learn more about this purple button"
/>

例​

リファレンス

Props​

必須
onPress​

ユーザーがボタンをタップしたときに呼び出されるハンドラー。

型
({nativeEvent: PressEvent})

必須
title​

ボタン内に表示するテキスト。Android では、指定されたタイトルは大文字形式に変換されます。

型
string

accessibilityLabel​

視覚障害者向けのアクセシビリティ機能に表示するテキスト。

型
string

accessibilityLanguage
iOS
​

ユーザーが要素を操作する際にスクリーンリーダーが使用すべき言語を示す値です。BCP 47仕様に従う必要があります。

詳細はiOSの `accessibilityLanguage` ドキュメントを参照してください。

型
string

accessibilityActions​

アクセシビリティアクションを使用すると、支援技術がコンポーネントのアクションをプログラムで呼び出すことができます。accessibilityActionsプロパティには、アクションオブジェクトのリストを含める必要があります。各アクションオブジェクトには、フィールド名とラベルを含める必要があります。

詳細はアクセシビリティガイドを参照してください。

型必須
arrayNo

onAccessibilityAction​

ユーザーがアクセシビリティアクションを実行したときに呼び出されます。この関数への唯一の引数は、実行するアクションの名前を含むイベントです。

詳細はアクセシビリティガイドを参照してください。

型必須
functionNo

color​

テキストの色 (iOS)、またはボタンの背景色 (Android)。

型デフォルト
color '#2196F3'
Android
'#007AFF'
iOS

disabled​

true の場合、このコンポーネントのすべてのインタラクションを無効にします。

型デフォルト
boolfalse

hasTVPreferredFocus
TV
​

TV の優先フォーカス。

型デフォルト
boolfalse

nextFocusDown
Android
TV
​

ユーザーが下に移動したときにフォーカスを受け取る次のビューを指定します。Android ドキュメントを参照してください。

型
number

nextFocusForward
Android
TV
​

ユーザーが前方に移動したときにフォーカスを受け取る次のビューを指定します。Android ドキュメントを参照してください。

型
number

nextFocusLeft
Android
TV
​

ユーザーが左に移動したときにフォーカスを受け取る次のビューを指定します。Android ドキュメントを参照してください。

型
number

nextFocusRight
Android
TV
​

ユーザーが右に移動したときにフォーカスを受け取る次のビューを指定します。Android ドキュメントを参照してください。

型
number

nextFocusUp
Android
TV
​

ユーザーが上に移動したときにフォーカスを受け取る次のビューを指定します。Android ドキュメントを参照してください。

型
number

testID​

E2Eテストでこのビューを特定するために使用されます。

型
string

touchSoundDisabled
Android
​

true の場合、タッチ時にシステムサウンドを再生しません。

型デフォルト
booleanfalse