Add FontScale property to IFontElement

[michalpobuta]

Description

In the current version of .NET MAUI, there is no built-in option to easily scale all fonts across the app. To address this limitation, a potential solution would be to introduce a property that allows for dynamic adjustment of the FontScale, enabling users to scale fonts consistently throughout the application.

Public API Changes

var button = new Button();
button.FontScale = 1.5;
var label = new Label();
label.FontScale = 1.5;

Intended Use-Case

I am looking to enhance accessibility within my application by enabling users to adjust the font scale through the app settings or by modifying the system font scale. However, it is important to implement limitations to prevent excessive scaling, as the current auto-scaling feature lacks constraints and consequently affects the app layout control.

[github-actions[bot]]

Hi I'm an AI powered bot that finds similar issues based off the issue title.

Please view the issues below to see if they solve your problem, and if the issue describes your problem please consider closing this one and thumbs upping the other issue to help us prioritize it. Thank you!

Open similar issues:

• Improve font autoscaling flexibility (#14438), similarity score: 0.79
• New Property "MaximumFontSize" (#21370), similarity score: 0.78
• [Enhancement] Label Autofit Font (#10884), similarity score: 0.71

Closed similar issues:

• [Spec] Font.AutoScalingEnabled and make scaling reactive (#1683), similarity score: 0.73

Note: You can give me feedback by thumbs upping or thumbs downing this comment.

[WMLPB]

Hi Michalpobuta,

I solved this problem with the following layout – it scales all controls like ImageButtons too, not only controls with text. Just put all your content into it:

public class ZoomLayout : AbsoluteLayout
{
    public static readonly BindableProperty ZoomFactorProperty =
        BindableProperty.Create(nameof(ZoomFactor), typeof(double), typeof(ZoomLayout), 1.0, propertyChanged: LayoutPropertyChanged);

    public double ZoomFactor
    {
        get => (double)GetValue(ZoomFactorProperty);
        set => SetValue(ZoomFactorProperty, value);
    }

    public class ZoomLayoutManager : AbsoluteLayoutManager
    {
        private ZoomLayout _zoomLayout = null;

        public ZoomLayoutManager(IAbsoluteLayout absoluteLayout) : base(absoluteLayout)
        {
            _zoomLayout = (ZoomLayout)absoluteLayout;
        }

        public override Size Measure(double widthConstraint, double heightConstraint)
        {
            var zoomFactor = _zoomLayout.ZoomFactor;
            var bounds = Math.Ceiling(1.0 / zoomFactor);
            var result = base.Measure(widthConstraint, heightConstraint);

            if ((Math.Ceiling(result.Width) <= bounds) || (Math.Ceiling(result.Height) <= bounds))
            {
                var padding = _zoomLayout.Padding;

                var availableWidth = (widthConstraint - padding.HorizontalThickness) / zoomFactor;
                var availableHeight = (heightConstraint - padding.VerticalThickness) / zoomFactor;

                double infinityWidth = 0;
                double infinityHeight = 0;

                double measuredWidth = 0;
                double measuredHeight = 0;

                for (int n = 0; n < _zoomLayout.Count; n++)
                {
                    var child = _zoomLayout[n];

                    if (child.Visibility == Visibility.Collapsed)
                        continue;

                    var infinity = child.Measure(double.PositiveInfinity, double.PositiveInfinity);

                    if ((infinity.Width * zoomFactor) >= availableWidth)
                        infinity = child.Measure(availableWidth, double.PositiveInfinity);

                    var measure = child.Measure(availableWidth, availableHeight);

                    infinityWidth = Math.Min(widthConstraint, infinity.Width * zoomFactor);
                    infinityHeight = Math.Min(heightConstraint, infinity.Height * zoomFactor);

                    measuredWidth = Math.Min(Math.Max(measuredWidth, measure.Width * zoomFactor), infinityWidth);
                    measuredHeight = Math.Min(Math.Max(measuredHeight, measure.Height * zoomFactor), infinityHeight);
                }

                measuredWidth += padding.HorizontalThickness;
                measuredHeight += padding.VerticalThickness;

                var finalWidth = ResolveConstraints(widthConstraint, AbsoluteLayout.Width, measuredWidth);
                var finalHeight = ResolveConstraints(heightConstraint, AbsoluteLayout.Height, measuredHeight);

                return new Size(finalWidth, finalHeight);
            }

            return result;
        }
    }

    public ZoomLayout() : base()
    {

    }

    protected override ILayoutManager CreateLayoutManager()
    {
        return new ZoomLayoutManager(this);
    }

    private void UpdateLayout(View view)
    {
        var factor = 1.0 / ZoomFactor;

        this.SetLayoutBounds(view, new Rect(0, 0, factor, factor));
        this.SetLayoutFlags(view, AbsoluteLayoutFlags.SizeProportional);

        view.AnchorX = 0;
        view.AnchorY = 0;

        view.Scale = ZoomFactor;
    }

    private void UpdateLayout(IView view)
    {
        if (view is View)
            UpdateLayout((View)view);
    }

    private void UpdateLayout(Element element)
    {
        if (element is View)
            UpdateLayout((View)element);
    }

    protected override void OnChildAdded(Element child)
    {
        UpdateLayout(child);
        base.OnChildAdded(child);
    }

    protected override void OnUpdate(int index, IView view, IView oldView)
    {
        base.OnUpdate(index, view, oldView);
        UpdateLayout(view);
    }

    private static void LayoutPropertyChanged(BindableObject bindable, object oldValue, object newValue)
    {
        var layout = (ZoomLayout)bindable;

        foreach (var item in layout.Children)
            layout.UpdateLayout(item);
    }
}