microsoft / microsoft/react-native-windows
Can't nest layouts
Open
Nobody has claimed this yet.
Area: Layout
Deliverable
enhancement
Needs: Dev Design
Partner: Microsoft
Recommend: Not Planned
- Dominant language
- C++
- Stars
- 17.3k
- Forks
- 1.2k
- Avg merge
- 1d 13h
- Merged PRs (30d)
- 33
Description
RN components use Yoga,
XAML elements use XAML (Measure/Arrange)
There isn't a way for XAML to be aware of Yoga (and the mechanisms for how layout works are incompatible).
So if we have a native panel that lays out its children and we try to add a RN component, the component won't lay out properly:
<StackPanel>
<Text style={{ alignSelf: "flex-start" }}>foo</Text>
</StackPanel>
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the StackPanel and Text example in issue #7601, then trace how React Native uses Yoga alongside XAML's Measure/Arrange layout mechanisms. Define what supported nested layout should mean and verify that a React Native component inside a native XAML panel lays out correctly.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native
- Domain
- desktop, frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100