How to style Group Headers of RadDataForm?

Question

DataForm docs says; I need to create an instance of GroupTitleStyle and set it to the PropertyGroup's titleStyle property.

But how and where to create grouptitlestyle in nativescript-vue?

I have created an {N} playground

I already tried:

         return {
             groups: [
                    Object.assign(new PropertyGroup(), {
                        name: "Personal",
                        collapsible: true,
                        collapsed: false,
                        titleStyle: {
                            labelTextSize: 22
                        }
                    }),

                    Object.assign(new PropertyGroup(), {
                        name: "Address",
                        collapsible: true,
                        collapsed: true
                    })
                ],

Would you please help me to set labelTextSize to RadDataForm groups?

Thanks in advance

Answer 1

Simply pass GroupTitleStyle instance, not plain object.

      ....
               Object.assign(new PropertyGroup(), {
                    name: "Personal",
                    collapsible: true,
                    collapsed: false,
                    titleStyle: Object.assign(
                    new GroupTitleStyle(), {
                        labelTextSize: 40
                    })
                }),
     ....

Updated Playground