NativeScript Angular RadDataForm 与 GridLayout 内的组不展开以显示 iOS 上的字段答案

【问题标题】：NativeScript Angular RadDataForm with groups inside GridLayout does not expand to show fields on iOSNativeScript Angular RadDataForm 与 GridLayout 内的组不展开以显示 iOS 上的字段
【发布时间】：2019-12-24 05:13:55
【问题描述】：

我在 Angular NativeScript (6.3.0) 组件中有这个 XML，当点击组标题时，表单组会在 Android 上正确展开和收缩。

在 iOS 上，如果使用 GridLayout rows="auto"，则组不会扩展，如果使用 rows="*"，则不会缩小。

<GridLayout rows="auto">
    <RadDataForm row="0" [source]="address">
        <TKPropertyGroup tkDataFormGroups collapsible="true" name="Edit this address" collapsed="true">
            <TKEntityProperty tkPropertyGroupProperties name="address" hintText="address" index="0">
                <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
            </TKEntityProperty>
            <TKEntityProperty tkPropertyGroupProperties name="address2" index="1">
                <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
            </TKEntityProperty>
            <TKEntityProperty tkPropertyGroupProperties name="city" index="2">
                <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
            </TKEntityProperty>
            <TKEntityProperty tkPropertyGroupProperties name="state" index="3">
                <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
            </TKEntityProperty>
            <TKEntityProperty tkPropertyGroupProperties name="postcode" index="4">
                <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
            </TKEntityProperty>
            <TKEntityProperty tkPropertyGroupProperties name="country" index="5">
                <TKPropertyEditor tkEntityPropertyEditor type="Text"></TKPropertyEditor>
            </TKEntityProperty>
        </TKPropertyGroup>
    </RadDataForm>
</GridLayout>

有没有其他人遇到过这个问题，或者我错过了一些标记以使其按我认为的那样工作？

【问题讨论】：

为什么你需要一个只有一行的 GridLayout？如果您打算堆叠其中 RadDataForm 是其中之一的项目，您可能会尝试 StackLayout。
为了简化示例代码，我删除了其他行，但我还阅读了一些帖子，指出 RadDataForm 在 StackLayout 中不起作用。即使没有其他行，它仍然会在 iOS 上显示问题。

标签： ios angular layout nativescript

【解决方案1】：

您可以在展开视图时在 RadDataForm 上强制重新布局。

<RadDataForm row="0" [source]="address"
    (groupExpanded)="onGroupExpanded($event)">


onGroupExpanded(event) {
    event.object.requestLayout();
}

Playground Sample

【讨论】：

感谢@Manoj，完美运行，并且在 groupCollapsed 事件中使用相同代码时也能正常运行。