RadDataForm Angular on iOS does not shrink or expand group fields

[billfrost]

This issue relates to iOS only - works fine on Android.

Versions: nativescript-ui-dataform: 6.0.0 CLI, tns-core-modules, tns-android, tns-ios: 6.3.0

Use the following in an Angular component.html file:

<GridLayout rows="auto,auto,*">
    <SearchBar row="0" hint="Enter search term here ...">
    </SearchBar>
    <RadDataForm row="1" [source]="address">
        <TKPropertyGroup tkDataFormGroups collapsible="true" name="Edit this address" collapsed="false" hidden="false">
            <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>
        </TKPropertyGroup>
    </RadDataForm>
    <TextField row="2" hint="Enter text" color="orangered" backgroundColor="lightgreen">
    </TextField>
</GridLayout>

Add this to the component.ts file:

private _address = new Address();
get address(): Address {
    return this._address;
}

Add Address.ts with this code:

export class Address {
    address: string;
    address2: string;

    constructor(address: string = '', address2: string = '') {
        this.address = address;
        this.address2 = address2;
    }
}

Run the app on Android and everything works as expected, with the group field expanding and shrinking as expected.

Run the app on iOS and observe that:

• when the GridLayout has rows="auto,auto,*", and TKPropertyGroup has collapsed="true", the RadDataForm does not expand, so form fields are hidden by the following component.
• when the GridLayout has rows="auto,*,*", the RadDataForm collapses and expands OK, but when collapsed, the group field does not shrink and still takes up the entire space it initially occupies.

[lini]

The dataform component will not resize automatically if you expand/collapse groups. To achieve this, first make sure that the dataform is in a grid row with height "auto" and not "*" and then add handlers for the groupExpanded/groupCollapsed events that adjust the component size. See this playground example for more details: https://play.nativescript.org/?template=play-ng&id=77Wrb6

[support[bot]]

:wave: @billfrost, we use the issue tracker exclusively for bug reports and feature requests. However, this issue appears to be a support request. Please, use Stackoverflow to get help.