How to access a named Expander inside a XAML DataTemplate in .NET MAUI Expander (SfExpander)?

You can access a named .NET MAUI Expander defined inside DataTemplate of SfPopup using a Behavior.

XAML
Add behavior to the parent of the SfExpander within SfPopup.

 <StackLayout>
     <StackLayout.Behaviors>
         <local:PopupBehavior/>
     </StackLayout.Behaviors>
     <Button Text="open popup" VerticalOptions="Start" HorizontalOptions="Center"/>

     <popup:SfPopup x:Name="popup" ShowFooter="False" ShowHeader="False" HeightRequest="400" WidthRequest="400">
         <popup:SfPopup.ContentTemplate>
             <DataTemplate>
                 <ScrollView>
                     <StackLayout>
                         <StackLayout.Behaviors>
                             <local:Behavior/>
                         </StackLayout.Behaviors>
                         <Button Text="Expand/collapse" x:Name="expanderButton"/>

                         <expander:SfExpander x:Name="firstExpander">
                             <expander:SfExpander.Header>
                                 <Grid>
                                     <Label VerticalTextAlignment="Center" HeightRequest="40" Text="Invoice Date"/>
                                 </Grid>
                             </expander:SfExpander.Header>
                             <expander:SfExpander.Content>
                                 <Grid>
                                     <Label Text="11.03 AM, 15 January 2019" VerticalTextAlignment="Center"/>
                                 </Grid>
                             </expander:SfExpander.Content>
                         </expander:SfExpander>
                         <expander:SfExpander x:Name="secondExpander">
                             <expander:SfExpander.Header>
                                 <Grid>
                                     <Label Text="Payment Details" VerticalTextAlignment="Center" HeightRequest="40"/>
                                 </Grid>
                             </expander:SfExpander.Header>
                             <expander:SfExpander.Content>
                                 <Grid Padding="10,10,10,10">
                                     <Grid.RowDefinitions>
                                         <RowDefinition Height="Auto" />
                                         <RowDefinition Height="Auto" />
                                         <RowDefinition Height="Auto" />
                                     </Grid.RowDefinitions>
                                     <Grid.ColumnDefinitions>
                                         <ColumnDefinition Width="*" />
                                         <ColumnDefinition Width="*" />
                                     </Grid.ColumnDefinitions>
                                     <Label Text="Card Payment" TextColor="#303030" HeightRequest="40"/>
                                     <Label Grid.Row="1" Text="Third-Party coupons"
                                            HeightRequest="40"/>
                                     <Label Grid.Row="2" FontAttributes="Bold" HeightRequest="40"
                                            Text="Total Amount Paid" />
                                     <Label Grid.Column="1" HorizontalTextAlignment="End"
                                            Text="$31,000.00"  HeightRequest="40"/>
                                     <Label Grid.Row="1" Grid.Column="1" Text="$5,000.00" HeightRequest="40"
                                            HorizontalTextAlignment="End" />
                                     <Label Grid.Row="2" Grid.Column="1" FontAttributes="Bold"
                                            HorizontalTextAlignment="End" Text="$36,000.00"
                                             HeightRequest="40"/>
                                 </Grid>
                             </expander:SfExpander.Content>
                         </expander:SfExpander>
                     </StackLayout>
                 </ScrollView>
             </DataTemplate>
         </popup:SfPopup.ContentTemplate>
     </popup:SfPopup>
 </StackLayout>

C#
Get the instance of Expander using ChildAdded event.

 public class Behavior:Behavior<StackLayout>
 {
     StackLayout stack;   
     SfExpander expander;

     protected override void OnAttachedTo(StackLayout bindable)
     {
         stack = bindable;
         stack.ChildAdded += Stack_ChildAdded;
         base.OnAttachedTo(bindable);
     }

     private void Stack_ChildAdded(object? sender, ElementEventArgs e)
     {
        //Method 1 : Get SfExpander reference using StackLayout.ChildAdded Event
         if(e.Element is SfExpander)
         {
             expander = e.Element as SfExpander;
         }
     }
     
     protected override void OnDetachingFrom(StackLayout bindable)
     {
         stack.ChildAdded -= Stack_ChildAdded;
         stack = null;
         expander = null;
         base.OnDetachingFrom(bindable);
     }
 }

C#
You can also get the Expander using FindByName method from the Parent element.

internal class Behavior : Behavior<StackLayout>
{
    StackLayout stack;
    Button button;
    SfExpander expander;

    protected override void OnAttachedTo(StackLayout bindable)
    {
        stack = bindable;
        stack.ChildAdded += Stack_ChildAdded;
        base.OnAttachedTo(bindable);
    }

    private void Stack_ChildAdded(object? sender, ElementEventArgs e)
    {
       if(e.Element is Button)
        {
            button = e.Element as Button;
            button.Clicked += Button_Clicked;
        }
    }

    private void Button_Clicked(object? sender, EventArgs e)
    {
        //Method 2 : Get SfExpander reference using FindByName
        expander = stack.FindByName<SfExpander>("firstExpander");
        App.Current!.MainPage!.DisplayAlert("Information", "first Expander instance is obtained and Expanded/Collapsed", "Ok");
         
        if (expander.IsExpanded)
        {
            expander.IsExpanded = false;
        }
        else
        {
            expander.IsExpanded = true;
        }
    }

    protected override void OnDetachingFrom(StackLayout bindable)
    {
        stack.ChildAdded -= Stack_ChildAdded;
        button.Clicked -= Button_Clicked;
        button = null;
        expander = null;
        base.OnDetachingFrom(bindable);
    }
}

Download the complete sample on GitHub

Conclusion:

I hope you enjoyed learning how to access a named Expander inside a XAML Data Template in .NET MAUI Expander.

You can refer to our .NET MAUI Expander feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started with configuration specifications.

Check out our components from the License and Downloads page for current customers. If you are new to Syncfusion®, try our 30-day free trial to check out our other controls.

Please let us know in the comments section if you have any queries or require clarification. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!