problem to cheng rotation of label in header in xamarin form expander when the expander is expand

Question

hi,
i want to rotate label of header of xamarin form expander(default value of rotation is +90)
when the expander is expand( when expander is expand then value of rotation will be 0) in xamrin forms
i used triger and binding but it not work,how can solve this problem?
thanks a lot in advance.

---

<Grid  >
 <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
 </Grid.ColumnDefinitions>
    <StackLayout Orientation="Vertical" Grid.Column="0" BackgroundColor="WhiteSmoke" >
    <StackLayout Orientation="Horizontal" >
            <!-- serch expander-->
            <BoxView Color="DarkBlue"   WidthRequest="3" HorizontalOptions="Start"  VerticalOptions="FillAndExpand"/>

            <xct:Expander ExpandAnimationEasing="CubicIn"
                                ExpandAnimationLength="500"
                                CollapseAnimationEasing="CubicOut"
                                CollapseAnimationLength="500">

                <xct:Expander.Header>

                    <Grid x:Name="GridHeaderSearch" >
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>



                        <Label  Text="Search" Grid.Column="0" Margin="0,15,0,5"
                               TextColor="#3e6db5"
                                VerticalOptions="Center"
                                   FontSize="Micro" >

                            <Label.Triggers>
                                <DataTrigger TargetType="Label"
                                      Binding="{Binding Source={x:Reference expander}}"
                                          Value="+90">
                                    <Setter Property="Rotation" Value="-90" />

                                </DataTrigger>
                            </Label.Triggers>
                             </Label>

                    </Grid>
                </xct:Expander.Header>
                  <xct:Expander.Content>
                 <StackLayout Spacing="10" Padding="5" Orientation="Vertical">
                        <ScrollView>
                            <StackLayout Spacing="5" HorizontalOptions="FillAndExpand"  WidthRequest="1000">

                                <StackLayout Orientation="Horizontal">
                                    <Label Text="1.Company: " WidthRequest="75" HorizontalOptions="Start" />

                                    <Picker  Title="Company" TitleColor="Black"   HorizontalOptions="FillAndExpand" />

                                </StackLayout>
                                <StackLayout Orientation="Horizontal">
                                    <Label Text="2.Person: " WidthRequest="75"  HorizontalOptions="Start" />
                                    <Picker Title="Person" TitleColor="Black"   HorizontalOptions="FillAndExpand" />

                                </StackLayout>

                                <StackLayout Orientation="Horizontal">
                                    <Label Text="3.person No:" WidthRequest="75"   HorizontalOptions="Start" />
                                    <Entry Text="Project No"   HorizontalOptions="FillAndExpand" />

                                </StackLayout>

                                <StackLayout Orientation="Horizontal">
                                    <Button Text="Save"    HorizontalOptions="FillAndExpand" />
                                </StackLayout>
                            </StackLayout>
                        </ScrollView>
                    </StackLayout>

                </xct:Expander.Content>

            </xct:Expander>

        </StackLayout>

    </StackLayout>

</Grid>

Answer 1

Hello,​

Welcome to our Microsoft Q&A platform!

i want to rotate label of header of Xamarin form expander(default value of rotation is +90)

If you want to set default value of rotation to 90, set Rotation="90" in the label tag directly.

when the expander is expand( when expander is expand then value of rotation will be 0) in Xamarin forms

I notice you used DataTrigger to achieve it. You set TargetType correctly, but you lack of Path for Binding property, you need to set Path value to Expander's IsExpanded property like following code. If the value of IsExpanded is true, we can set the value of Label's Rotation to 0 with <Setter> tag. Note: I add x:Name="expander" for <xct:Expander> tag.

   <Label  Text="Search" Grid.Column="0" Margin="0,15,0,5"  
                                           TextColor="#3e6db5"  
                                           VerticalOptions="Center"  
                                           Rotation="90"  
                                           FontSize="Micro" >  
     
                                       <Label.Triggers>  
     
                                           <DataTrigger TargetType="Label"  
                                                        Binding="{Binding Source={x:Reference expander},Path=IsExpanded}"  
                                                        Value="true">  
                                               <Setter Property="Rotation" Value="0" />  
     
                                           </DataTrigger>  
                                       </Label.Triggers>  
                                   </Label>  

Here is a great article about how to use Data triggers, you can refer to it.

Best Regards,

Leon Lu

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.