Binding triggered before control is loaded

[KatterMaw]

The goal is to display the underline of the tab element with a transition animation:

SightKeeper.Avalonia_nsgLCwD8VH.mp4

so I used canvas and MultiBinding to TabStrip via RelativeSource to position the underline

but the problem is that the binding is triggered before the elements are loaded, and the converter cannot receive the container of the selected item, because there is no panel yet:

as a result, the initially selected item (indicated in pale red) does not have a line under it until another item is selected:

SightKeeper.Avalonia_cwqQPGHZHA.mp4

is there a way to trigger binding without special crutches when the parent control (TabStrip) is fully loaded, or maybe I'm missing an easier way to do it in general?

[thevortexcloud]

The easiest way I can think of to work around this is to create the animation in code behind when the Loaded/AttachedToVisualTree events fire.

However, without seeing more of what you done it's hard to say if there is a better way.

[KatterMaw]

I do not think that code behind is suitable in my case because it is a theme that comes as a separate project and, accordingly, in this case, code behind should be modified in each end project and each view with TabStrip's. This idea can be expanded into an AttachedProperty with additional handlers, but perhaps there is a better solution.

[KatterMaw]

Fixed it with a not-so-ugly crutch

using Avalonia;
using Avalonia.Controls;
using Avalonia.Interactivity;
using Avalonia.Reactive;
using CommunityToolkit.Diagnostics;

namespace Sightful.Avalonia.Assists;

internal static class ControlAssists
{
	static ControlAssists()
	{
		TrackLoadingProperty.Changed.Subscribe(new AnonymousObserver<AvaloniaPropertyChangedEventArgs<bool>>(OnTrackLoadingChanged));
	}

	private static void OnTrackLoadingChanged(AvaloniaPropertyChangedEventArgs<bool> args)
	{
		var control = (Control)args.Sender;
		bool shouldTrack = args.NewValue.Value;
		if (shouldTrack)
		{
			control.Loaded += OnControlLoaded;
			control.DetachedFromVisualTree += OnControlDetached;
		}
		else
		{
			control.Loaded -= OnControlLoaded;
			control.DetachedFromVisualTree -= OnControlDetached;
		}
	}

	private static void OnControlLoaded(object? sender, RoutedEventArgs e)
	{
		Guard.IsNotNull(sender);
		var control = (Control)sender;
		SetIsLoaded(control, true);
	}

	private static void OnControlDetached(object? sender, VisualTreeAttachmentEventArgs e)
	{
		Guard.IsNotNull(sender);
		var control = (Control)sender;
		SetIsLoaded(control, false);
	}

	public static readonly AttachedProperty<bool> TrackLoadingProperty =
		AvaloniaProperty.RegisterAttached<Control, bool>("TrackLoading", typeof(ControlAssists));

	public static bool GetTrackLoading(AvaloniaObject element)
	{
		return element.GetValue(TrackLoadingProperty);
	}

	public static void SetTrackLoading(AvaloniaObject element, bool value)
	{
		element.SetValue(TrackLoadingProperty, value);
	}

	public static readonly AttachedProperty<bool> IsLoadedProperty =
		AvaloniaProperty.RegisterAttached<Control, bool>("IsLoaded", typeof(ControlAssists));

	public static bool GetIsLoaded(AvaloniaObject element)
	{
		return element.GetValue(IsLoadedProperty);
	}

	public static void SetIsLoaded(AvaloniaObject element, bool value)
	{
		element.SetValue(IsLoadedProperty, value);
	}
}

IsLoaded property binded in MultiBinding, so it is triggered when control is loaded (Control.Loaded event is very useful).
It would be much easier if the existing Control.IsLoaded property were presented as AvaloniaProperty.