Change ProgressBar height

csampaio01csampaio01 PTMember ✭✭✭
edited August 2017 in Xamarin.iOS

Hi, I created a custom renderer to change the height of a progress bar. the only problem is when the screen is rotated, the height goes back to normal.

public class MyProgressBarRenderer : ProgressBarRenderer
{
    protected override void OnElementChanged( ElementChangedEventArgs<Xamarin.Forms.ProgressBar> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            var base_entry = Element as MyProgressBar;
            if (base_entry != null)
            {
                Control.ProgressTintColor = base_entry.Cor.ToUIColor();
                Control.TrackTintColor = Color.FromHex("BFBFBF").ToUIColor();

            }

        }

    }


    public override void LayoutSubviews()
    {
        base.LayoutSubviews();

        var X = 1.0f;
        var Y = 10.0f;

        CGAffineTransform transform = CGAffineTransform.MakeScale(X, Y);
        this.Control.Transform = transform;

    }
}

Does someone have this problem that can help me pls?

Best Answer

  • csampaio01csampaio01 PT ✭✭✭
    edited August 2017 Accepted Answer

    @adamkemp the only way I got it to work is by redesign the layout everytime the screen rotates.

        double previousWidth;
        double previousHeight;
    
        protected override void OnSizeAllocated(double width, double height)
        {
            base.OnSizeAllocated(width, height);
    
                    if (cont > 1)
                    {
                        if (previousWidth != width || previousHeight != height)
                        {
                            previousWidth = width;
                            previousHeight = height;
    
                            UpdateScreen();
                        }
                    }
        }
    

Answers

  • csampaio01csampaio01 PTMember ✭✭✭

    Up

  • Luis_dmLuis_dm USMember ✭✭✭

    I use Acr.UserDialogs by aritchie for my applications, you can use Progress or loading.
    Without the need to use CustomRenderer.

    Link:
    https://github.com/aritchie/userdialogs

    Example:

    *Loading:
    UserDialogs.Instance.Loading("Cargando").Show();

    *Progress:
    UserDialogs.Instance.Progress().Show();
    UserDialogs.Instance.Progress().Title = "Cargando";
    UserDialogs.Instance.Progress().PercentComplete = 23;

    I hope to help you.

  • csampaio01csampaio01 PTMember ✭✭✭

    @LuisRodriguez92 that is interesting, but not what I want.
    I need to build multiple progress bar with one with a different colors. So far so good. Except when I rotate the screen, the height goes back to normal.

  • csampaio01csampaio01 PTMember ✭✭✭

    @adamkemp this is the post that I have created.

  • adamkempadamkemp USInsider, Developer Group Leader mod

    What specifically are you trying to do to the height of the progress bar? How do you want it to behave?

  • csampaio01csampaio01 PTMember ✭✭✭
    edited August 2017

    @adamkemp I need to increase its heigh for visual purposes only.
    It works perfect, but when the screen is rotated it goes back to normal.

    When the page appears:

    When the screen is rotated:

    To make it move I use:

    Device.StartTimer(new TimeSpan(0, 0, 0, 0, 1), () =>
    {
        if (topcliente1.Progress >= max1)
        {
            return false;
        }
        else
        {
            topcliente1.ProgressTo(topcliente1.Progress + 0.02, 1, Easing.Linear);
            return true;
        }
    });
    
  • adamkempadamkemp USInsider, Developer Group Leader mod

    But are you wanting a fixed size or just to fill the container? What does your XAML look like?

  • csampaio01csampaio01 PTMember ✭✭✭

    fill the container but with fixed height. I don't have XAML. @adamkemp

  • adamkempadamkemp USInsider, Developer Group Leader mod

    To do that you would write your LayoutSubviews something like this:

    public override void LayoutSubviews()
    {
        base.LayoutSubviews();
        const CGFloat height = 50; // whatever you want the height to be
        var bounds = this.Bounds;
    
        var location = new CGPoint(0, bounds.Height - height);
        var size = new CGSize(bounds.Width, height);
    
        this.Control.Frame = new CGRect(location, size);
    }
    

    That pins the control to the bottom of its container. You could also pin it to the top of center it vertically by just changing the logic for calculating the Y coordinate.

    If that doesn't work then you'll need to be more specific about what's going on. What is the actual type of Control (at runtime)? Including a full project would help.

  • csampaio01csampaio01 PTMember ✭✭✭
    edited August 2017 Accepted Answer

    @adamkemp the only way I got it to work is by redesign the layout everytime the screen rotates.

        double previousWidth;
        double previousHeight;
    
        protected override void OnSizeAllocated(double width, double height)
        {
            base.OnSizeAllocated(width, height);
    
                    if (cont > 1)
                    {
                        if (previousWidth != width || previousHeight != height)
                        {
                            previousWidth = width;
                            previousHeight = height;
    
                            UpdateScreen();
                        }
                    }
        }
    
Sign In or Register to comment.