`flexGrow: 1` inside `alignItems: <non-stretch>` covers siblings
Ouverte
Personne n'a encore pris cette issue.
Component: ScrollView
Issue: Author Provided Repro
Needs: Triage :mag:
Newer Patch Available
- Langage dominant
- C++
- Étoiles
- 127k
- Forks
- 25.3k
- Merge moyen
- 1 j 23 h
- PR mergées (30 j)
- 4
Description
Description
Android:
React Native Version
0.72.5
Output of npx react-native info
> npx react-native info
info Fetching system and libraries information...
System:
OS: Windows 10 10.0.22621
CPU: "(12) x64 AMD Ryzen 5 5600 6-Core Processor "
Memory: 16.28 GB / 31.91 GB
Binaries:
Node:
version: 20.2.0
path: C:\Program Files\nodejs\node.EXE
Yarn: Not Found
npm:
version: 9.7.2
path: C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK: Not Found
IDEs:
Android Studio: Not Found
Visual Studio:
- 17.5.33424.131 (Visual Studio Community 2022)
Languages:
Java:
version: 11.0.20.1
path: C:\Program Files\Eclipse Adoptium\jdk-11.0.20.101-hotspot\bin\javac.EXE
Ruby: Not Found
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.72.5
wanted: 0.72.5
react-native-windows: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: true
iOS:
hermesEnabled: Not found
newArchEnabled: Not found
Steps to reproduce
import { View, Text } from 'react-native';
export default function App() {
return (
<View>
<View style={{ alignItems: 'center', }}>
<View style={{ backgroundColor: 'red' }}>
<View style={{ flexGrow: 1 }}>
<Text>foo</Text>
</View>
</View>
<Text>foo</Text>
<Text>foo</Text>
<Text>foo</Text>
<Text>foo</Text>
</View>
</View>
);
}
Snack, screenshot, or link to a repository
Guide de contribution
Ouvrir le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Piste de recherche
Commencez par reproduire la mise en page dans l’Expo Snack lié en utilisant la configuration React Native 0.72.5 indiquée, en vous concentrant sur alignItems défini sur une valeur autre que stretch et sur la vue imbriquée avec flexGrow. Comparez le rendu Android avec la mise en page attendue des éléments frères ; le travail est terminé lorsque l’enfant avec flexGrow ne recouvre plus ses frères.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- javascript, react-native
- Domaine
- mobile
- Type d'issue
- Bug
- Difficulté
- 4/5
- Temps estimé
- 3-5 jours
- Activité
- À l'abandon
- Clarté
- Plutôt claire
- Accessibilité débutants
- 35/100