Adjust opacity of Header text

[Jim Young]

Is there an example of the SfAccordion Header template? I need to adjust the opacity of the text in the header. It is too dim for my application.

Thanks.

[Venkateshwaran Ramdoss]

Hi Jim, 

Thank you for contacting Syncfusion Support. 

We have prepared a sample for your requirement. In this sample, we have used the HeaderTemplate and bind the Header value in the TextBlock. Please make use of the below code example. 

Code example 

 

<layout:SfAccordion x:Name="accordion" SelectionMode="OneOrMore"  

                            VerticalAlignment="Center" Width="450" > 

            <layout:SfAccordion.HeaderTemplate> 

                <DataTemplate> 

                    <TextBlock Text="{Binding}" Foreground="Red" Opacity="1" FontFamily="Calibri" FontWeight="Bold" FontSize="20"/> 

                </DataTemplate> 

            </layout:SfAccordion.HeaderTemplate> 

            <layout:SfAccordionItem Header="Winrt" Content="Essential Studio for WinRT"/> 

            <layout:SfAccordionItem Header="Windows Phone" Content="Essential Studio for Windows Phone"/> 

            <layout:SfAccordionItem Header="WPF" Content="Essential Studio for WPF"/> 

            <layout:SfAccordionItem Header="Universal" Content="Essential Studio for Universal"/> 

</layout:SfAccordion> 

 

We have prepared a sample and screenshot for your reference and it can be downloaded from the below link. 

Sample: SfAccordion_customization  

 

Screenshot 

 

 

 

Please check the above solution and let us know if it is helpful. 

Regards, 

Venkateshwaran V.R.