RelativeLayout order view childrens

Question

Good morning community!

I'm having a problem in a relativeLayout that I made some time ago. The fact is that with previous versions of Xamarin it has always worked perfectly for me, however I don't know why it has stopped working.

This relativeLayout contains two children, a button and an ActivityIndicator.

The operation is that initially the button appears with the text, when pressing the button it starts a task, it would have to hide the text and show the activity while it is performing the task.

The fact is that it is not performing the expected behavior. When pressing the button the text disappears but the activityIndicator is not presented, I have found that if I have other elements and I interact with them it suddenly shows the activityIndicator, even if instead of hiding the hidden text the entire button the activity appears below the button, so it seems that the problem is about the order of the views.

Could someone help me in this case.

Attached is a sample of the code that does the job.

A greeting.

Answer 1

Hello,​

Welcome to our Microsoft Q&A platform!

In your original code, Please add the Forms.SetFlags("UseLegacyRenderers"); in the MainActivity.cs
Then your code will work normally.

This issue is related to the Xamarin.Forms Fast Renderers, use custom control(ViewGroup: relativelayout with button and activityIndicator) has a performance implication in that two views are created for each logical control, which results in a more complex visual tree that requires more memory, and more processing to render on screen.

Here is running gif.

Best Regards,

Leon Lu

---

If the response is helpful, please click "Accept Answer" and upvote it.

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.

Answer 2

Doing some tests, I have discovered that if I change the SetTextBasedOnBusy method to this

        static void SetTextBasedOnBusy(ButtonPersonal control, bool isBusy, string text)
        {
            var activityIndicator = GetActivityIndicator(control);
            var button = GetButton(control);

            if (activityIndicator == null || button == null)
            {
                return;
            }

            if (isBusy)
            {
                button.Text = string.Empty;
                activityIndicator.IsVisible = true;
                activityIndicator.IsEnabled = true;
                activityIndicator.IsRunning = true;
                button.IsVisible = false;
                button.IsEnabled = false;
                button.IsVisible = true;
                button.IsEnabled = true;
            }
            else
            {
                button.Text = control.Text;
                activityIndicator.IsVisible = false;
                activityIndicator.IsEnabled = false;
                activityIndicator.IsRunning = false;
                button.IsVisible = true;
                button.IsEnabled = true;
            }
        }

It is working as expected, however I do not know if it is a bug or what it is because I am really hiding and showing the element.

Answer 3

Hi LeonLu, thank you for your time.

I understand that what it says is that I can manage these elements separately, but I would like to be able to make the relatedLayout work as I have it implemented for two things, first I like the appearance of the activity above the button while it is performing the task, and second that I can replicate this behavior across multiple sites in my application.

I have tried without exist to fix the problem using RaiseChild (View), using LowerChild (View) and ForceLayout (), all of them RelativeLayout methods, but did not get the expected result.

If I substitute this method

static void SetTextBasedOnBusy(ButtonPersonal control, bool isBusy, string text)
        {
            var activityIndicator = GetActivityIndicator(control);
            var button = GetButton(control);

            if (activityIndicator == null || button == null)
            {
                return;
            }
            activityIndicator.IsVisible = activityIndicator.IsRunning = isBusy;
            activityIndicator.IsEnabled = activityIndicator.IsRunning = isBusy;
            button.Text = isBusy ? string.Empty : control.Text;
        }

for this

static void SetTextBasedOnBusy(ButtonPersonal control, bool isBusy, string text)
        {
            var activityIndicator = GetActivityIndicator(control);
            var button = GetButton(control);

            if (activityIndicator == null || button == null)
            {
                return;
            }

            if (isBusy)
            {
                button.Text = string.Empty;
                activityIndicator.IsVisible = true;
                activityIndicator.IsEnabled = true;
                activityIndicator.IsRunning = true;
                button.IsVisible = false;
                button.IsEnabled = false;
            }
            else
            {
                button.Text = control.Text;
                activityIndicator.IsVisible = false;
                activityIndicator.IsEnabled = false;
                activityIndicator.IsRunning = false;
                button.IsVisible = true;
                button.IsEnabled = true;
            }
        }

I get roughly what you suggest, but I don't like the way it looks as the button is hidden during processing.

Thank you very much for your time again, but I would like another solution

a greeting