Téléchargement picker - Téléchargement du code source picker

picker

Autre code source

v2.10.2

Télécharger

`@react-native-picker/picker`

Androïde	ios	Pickerios

Fenêtre	Macos

Versions prises en charge

@ réactif-natif-picker / cueilleur	réactif natif	réagir-natifs
> = 2.0.0	0,61+	0,64+
> = 1.16.0	0,61+	0,61+
> = 1.2.0	0,60+ ou 0,59+ avec Jetificier	N / A
> = 1.0.0	0,57	N / A

Commencer

$ npm install @react-native-picker/picker --save

ou

$ yarn add @react-native-picker/picker

Pour React Native V0.60 et au-dessus (automatiquement)

Comme [email protected] et supérieur à la prise en charge de la mise à pied, il n'est pas nécessaire d'exécuter le processus de liaison. En savoir plus sur la mise à pied ici. Ceci est pris en charge par [email protected] et au-dessus.

ios

Cocoapods sur iOS a besoin de cette étape supplémentaire:

 npx pod-install

Androïde

Aucune étape supplémentaire n'est requise.

Windows (développer pour plus de détails)

Fenêtre

L'utilisation dans les fenêtres sans automatiquement nécessite les étapes supplémentaires suivantes:

Ajoutez le projet `ReactNativePicker` à votre solution.

Ouvrez la solution dans Visual Studio 2019
Cliquez avec le bouton droit sur l'icône de la solution dans Solution Explorer> Add> Projet existant Sélectionnez D:devRNTestnode_modules@react-native-pickerpickerwindowsReactNativePickerReactNativePicker.vcxproj

Windows / MyApp.sln

Ajoutez une référence à ReactNativePicker à votre projet d'application principal. De Visual Studio 2019:

Cliquez avec le bouton droit sur le projet d'application principale> Ajouter> Référence ... Vérifiez ReactNativePicker à partir des projets de solution.

app.cpp

Ajoutez #include "winrt/ReactNativePicker.h" aux en-têtes inclus en haut du fichier.

Ajouter PackageProviders().Append(winrt::ReactNativePicker::ReactPackageProvider()); avant InitializeComponent(); .

Macos

Cocoapods sur macOS a besoin de cette étape supplémentaire (appelée à partir du répertoire macOS)

 pod install

React natif en dessous de 0,60 (liaison et installation manuelle)

Les étapes suivantes ne sont nécessaires que si vous travaillez avec une version de React Native inférieure à 0,60

Installation principalement automatique

$ react-native link @react-native-picker/picker

Installation manuelle

ios

Dans Xcode, dans le Navigator du projet, Libraries de clic droit ➜ Add Files to [your project's name]
Allez sur node_modules ➜ @react-native-picker/picker et ajoutez RNCPicker.xcodeproj
Dans Xcode, dans le Navigator du projet, sélectionnez votre projet. Ajouter libRNCPicker.a aux Build Phases de votre projet ➜ Link Binary With Libraries
Exécutez votre projet ( Cmd+R ) <

Androïde

Ouvrez le fichier d'application ( android/app/src/main/java/[...]/MainApplication.java ...

Ajouter import com.reactnativecommunity.picker.RNCPickerPackage; aux importations en haut du fichier
Ajouter new RNCPickerPackage() à la liste renvoyée par la méthode getPackages()

Ajoutez les lignes suivantes à android/settings.gradle :

 include ':@react-native-picker_picker'
project(':@react-native-picker_picker').projectDir = new File(rootProject.projectDir, 	'../node_modules/@react-native-picker/picker/android')

Insérez les lignes suivantes à l'intérieur du bloc des dépendances dans android/app/build.gradle :
```
  implementation project(path: ':@react-native-picker_picker')
```

Macos

Dans Xcode, dans le Navigator du projet, Libraries de clic droit ➜ Add Files to [your project's name]
Allez sur node_modules ➜ @react-native-picker/picker et ajoutez RNCPicker.xcodeproj
Dans Xcode, dans le Navigator du projet, sélectionnez votre projet. Ajouter libRNCPicker.a aux Build Phases de votre projet ➜ Link Binary With Libraries
Exécutez votre projet ( Cmd+R ) <

Support RTL

Vous devez ajouter android:supportsRtl="true" à AndroidManifest.xml

   < application
      ...
      android : supportsRtl = " true " >

Usage

Picker d'importation à partir de @react-native-picker/picker :

 import { Picker } from '@react-native-picker/picker' ;

Créer un état qui sera utilisé par le Picker :

 const [ selectedLanguage , setSelectedLanguage ] = useState ( ) ;

Ajoutez Picker comme ceci:

 < Picker
  selectedValue = { selectedLanguage }
  onValueChange = { ( itemValue , itemIndex ) =>
    setSelectedLanguage ( itemValue )
  } >
  < Picker . Item label = "Java" value = "java" />
  < Picker . Item label = "JavaScript" value = "js" />
</ Picker >

Si vous souhaitez ouvrir / fermer le sélecteur par programme sur Android (disponible à partir de la version 1.16.0+), passez Ref au Picker :

 const pickerRef = useRef ( ) ;

function open ( ) {
  pickerRef . current . focus ( ) ;
}

function close ( ) {
  pickerRef . current . blur ( ) ;
}

return < Picker
  ref = { pickerRef }
  selectedValue = { selectedLanguage }
  onValueChange = { ( itemValue , itemIndex ) =>
    setSelectedLanguage ( itemValue )
  } >
  < Picker . Item label = "Java" value = "java" />
  < Picker . Item label = "JavaScript" value = "js" />
</ Picker >

Accessoires

Accessoires View héréditaire ...

onValueChange
selectedValue
style
testID
enabled
mode
prompt
itemStyle
selectionColor

Référence

Accessoires

`onValueChange`

Rappel pour quand un élément est sélectionné. Ceci s'appelle avec les paramètres suivants:

itemValue : L'accessoire value de l'élément sélectionné
itemPosition : l'indice de l'élément sélectionné dans ce sélecteur

Taper	Requis
fonction	Non

`selectedValue`

Valeur de correspondance de valeur de l'un des éléments. Peut être une chaîne ou un entier.

Taper	Requis
n'importe lequel	Non

`style`

Taper	Requis
PickersTyletype	Non

`testID`

Utilisé pour localiser cette vue dans les tests de bout en bout.

Taper	Requis
chaîne	Non

`enabled`

S'il est réglé sur False, le sélecteur sera désactivé, c'est-à-dire que l'utilisateur ne pourra pas faire de sélection.

Taper	Requis	Plate-forme
bool	Non	Android, Web, Windows

`mode`

Sur Android, spécifie comment afficher les éléments de sélection lorsque l'utilisateur tape sur le sélecteur:

'Dialogue': Afficher une boîte de dialogue modale. C'est la valeur par défaut.
«Dropdown»: affiche une liste déroulante ancrée à la vue de sélecteur

Taper	Requis	Plate-forme
enum ('dialogue', 'dropdown')	Non	Androïde

`dropdownIconColor`

Sur Android, spécifie la couleur du triangle déroulant. La valeur d'entrée doit être la valeur acceptée par la fonction React-Native processColor .

Taper	Requis	Plate-forme
Colorimer	Non	Androïde

`dropdownIconRippleColor`

Sur Android, spécifie la couleur Ripple du triangle déroulant. La valeur d'entrée doit être la valeur acceptée par la fonction React-Native processColor .

Taper	Requis	Plate-forme
Colorimer	Non	Androïde

`prompt`

Invite String pour ce sélecteur, utilisé sur Android en mode de dialogue comme titre de la boîte de dialogue.

Taper	Requis	Plate-forme
chaîne	Non	Androïde

`itemStyle`

Style à appliquer à chacune des étiquettes des articles.

Taper	Requis	Plate-forme
styles de texte	Non	iOS, fenêtres

`numberOfLines`

Sur Android & iOS, utilisé pour tronquer le texte avec une ellipsis après avoir calculé la disposition du texte, y compris l'enveloppement de lignes, de sorte que le nombre total de lignes ne dépasse pas ce nombre. La valeur par défaut est '1'

Taper	Requis	Plate-forme
nombre	Non	Android, iOS

`onBlur`

Taper	Requis	Plate-forme
fonction	Non	Androïde

`onFocus`

Taper	Requis	Plate-forme
fonction	Non	Androïde

`selectionColor`

Taper	Requis	Plate-forme
Colorimer	Non	ios

Méthodes

`blur` (Android uniquement, lib version 1.16.0+)

Ferme le sélectionneur par programme

`focus` (Android uniquement, Lib version 1.16.0+)

Ouvre un cueilleur programmatique

PicleriteMprops

Accessoires qui peuvent être appliqués au Picker.Item individuel.

`label`

Valeur affichée sur l'élément de sélecteur

Taper	Requis
chaîne	Oui

`value`

Valeur réelle sur l'élément de sélecteur

Taper	Requis
numéro, chaîne	Oui

`color`

Couleur affichée sur l'élément de sélecteur

Taper	Requis
Colorimer	Non

`fontFamily`

Fontfamily affichée sur l'élément de sélecteur

Taper	Requis
chaîne	Non

`style`

Style à appliquer aux étiquettes d'articles individuelles.

Taper	Requis	Plate-forme
Viewstyleprop	Non	Androïde

`enabled`

Si réglé sur False, l'élément spécifique sera désactivé, c'est-à-dire que l'utilisateur ne pourra pas faire de sélection

@default: vrai

Taper	Requis	Plate-forme
booléen	Non	Androïde

`contentDescription`

Définit la description du contenu sur l'élément Picker

Taper	Requis	Plate-forme
chaîne	Non	Androïde

Pickerios

Accessoires

Accessoires View héréditaire ...
itemStyle
onValueChange
selectedValue
selectionColor
themeVariant

Référence

Accessoires

`itemStyle`

Taper	Requis
styles de texte	Non

`onValueChange`

Taper	Requis
fonction	Non

`selectedValue`

Taper	Requis
n'importe lequel	Non

`selectionColor`

Taper	Requis	Plate-forme
Colorimer	Non	ios

`themeVariant`

Taper	Requis
enum («clair», «sombre»)	Non

Développer

Informations supplémentaires

Version v2.10.2
Type Autre code source
Date de mise à jour 2025-05-09
taille 2.36MB
Provenant de Github

Applications connexes

Logiciel Meal Picker+ authentique

2024-08-08

Recommandé pour vous

chat.petals.dev

Autre code source

1.0.0
GPT Prompt Templates

Autre code source

1.0.0
GPTyped

Autre code source

GPTyped 1.0.5
Google Dorks

Autre code source

1.0
shepherd

Autre code source

v6.1.6-react-shepherd: Prepare Release (#3063)
mongo express

Autre code source

v1.1.0-rc-3
Google Dorks

Autre code source

1.0
shepherd

Autre code source

v6.1.6-react-shepherd: Prepare Release (#3063)
mongo express

Autre code source

v1.1.0-rc-3

Actualités connexes Tout

picker

@react-native-picker/picker

Versions prises en charge

Commencer

Pour React Native V0.60 et au-dessus (automatiquement)

ios

Androïde

Fenêtre

Ajoutez le projet ReactNativePicker à votre solution.

Windows / MyApp.sln

app.cpp

Macos

Installation principalement automatique

Installation manuelle

ios

Androïde

Macos

Support RTL

Usage

Accessoires

Référence

Accessoires

onValueChange

selectedValue

style

testID

enabled

mode

dropdownIconColor

dropdownIconRippleColor

prompt

itemStyle

numberOfLines

onBlur

onFocus

selectionColor

Méthodes

blur (Android uniquement, lib version 1.16.0+)

focus (Android uniquement, Lib version 1.16.0+)

PicleriteMprops

label

value

color

fontFamily

style

enabled

contentDescription

Pickerios

Accessoires

Référence

Accessoires

itemStyle

onValueChange

selectedValue

selectionColor

themeVariant

`@react-native-picker/picker`

Ajoutez le projet `ReactNativePicker` à votre solution.

`onValueChange`

`selectedValue`

`style`

`testID`

`enabled`

`mode`

`dropdownIconColor`

`dropdownIconRippleColor`

`prompt`

`itemStyle`

`numberOfLines`

`onBlur`

`onFocus`

`selectionColor`

`blur` (Android uniquement, lib version 1.16.0+)

`focus` (Android uniquement, Lib version 1.16.0+)

`label`

`value`

`color`

`fontFamily`

`style`

`enabled`

`contentDescription`

`itemStyle`

`onValueChange`

`selectedValue`

`selectionColor`

`themeVariant`