0

I am working on my first app with Xamarin Forms in Visual Studio 2015.

I have a page with a grid, which is in a StackLayout, which is in a ScrollView, which is in an AbsoluteLayout.

Here is the constructor for that page:

public ConditionsPage(long reportId)
        {
            InitializeComponent();

            Title = "New Entry";

            this.ReportId = reportId;

            var columns =
                DependencyService.Get<IGetReports.IGetReportsService>().GetAllVisibleColumns(ReportId);

            Rows = new List<RowEntry>();

            foreach (var c in columns)
            {

                Label label = new Label
                {
                    Text = c.ColumnName,
                    FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)),
                    HorizontalOptions = LayoutOptions.Center,
                    VerticalOptions = LayoutOptions.Center,
                    TextColor = Color.Black
                };

                Picker picker = new Picker
                {
                    Title = "Condition",
                    HorizontalOptions = LayoutOptions.Center,
                    VerticalOptions = LayoutOptions.Center,
                    TextColor = Color.Black
                };

                foreach (string condition in conditionOperators.Values)
                {
                    picker.Items.Add(condition);
                }

                // Create Entry for condition value input
                Entry rowEntry = new Entry()
                {
                    WidthRequest = 100,
                    HeightRequest = 50,
                    HorizontalOptions = LayoutOptions.Center,
                    VerticalOptions = LayoutOptions.Center,
                    TextColor = Color.Black,
                };
                if (c.ColumnType == ReportColumnType.Datetime)
                {
                    rowEntry.Keyboard = Keyboard.Text;
                }
                else if (c.ColumnType == ReportColumnType.Text)
                {
                    rowEntry.Keyboard = Keyboard.Text;
                }
                else
                {
                    rowEntry.Keyboard = Keyboard.Numeric;
                }


                Rows.Add(new RowEntry() {ColumnId = c.Id, Entry = rowEntry, Label = label, Picker = picker });
            }

            // Build the page.
            var absoluteLayout = new AbsoluteLayout();
            var stackLayout = new StackLayout();
            var scrollView = new ScrollView();

            var grid = new Grid()
            {
                VerticalOptions = LayoutOptions.Fill,
                HorizontalOptions = LayoutOptions.Fill,
                RowDefinitions =
                {
                    new RowDefinition { Height = GridLength.Auto },
                    new RowDefinition { Height = GridLength.Auto },
                    new RowDefinition { Height = new GridLength(1, GridUnitType.Star) },
                    new RowDefinition { Height = new GridLength(100, GridUnitType.Absolute) }
                },
                ColumnDefinitions =
                {
                    new ColumnDefinition { Width = GridLength.Auto },
                    new ColumnDefinition { Width = new GridLength(1, GridUnitType.Star) },
                    new ColumnDefinition { Width = new GridLength(100, GridUnitType.Absolute) }
                }
            };

            int i = 0;
            foreach (var row in Rows)
            {
                grid.Children.Add(row.Label, 0, i);
                grid.Children.Add(row.Picker, 1, i);
                grid.Children.Add(row.Entry, 2, i);
                i++;
            }

            stackLayout.Children.Add(grid);
            var generateReportButton = new Button()
            {
                Text = "Generate Report"
            };
            generateReportButton.Clicked += new EventHandler(GenerateReport_OnClicked);
            stackLayout.Children.Add(generateReportButton);

            stackLayout.HorizontalOptions = LayoutOptions.Fill;
            stackLayout.VerticalOptions = LayoutOptions.Fill;

            scrollView.HorizontalOptions = LayoutOptions.Fill;
            scrollView.VerticalOptions = LayoutOptions.Fill;

            scrollView.Content = stackLayout;

            absoluteLayout.Layout(new Rectangle(0,0, AbsoluteLayout.AutoSize, AbsoluteLayout.AutoSize));

            AbsoluteLayout.SetLayoutFlags(scrollView, AbsoluteLayoutFlags.PositionProportional);

            absoluteLayout.Children.Add(scrollView);



            absoluteLayout.HorizontalOptions = LayoutOptions.Fill;
            absoluteLayout.VerticalOptions = LayoutOptions.Fill;

            Content = absoluteLayout;
        }

I have another page that the app goes to after the 'Generate' button is clicked:

Navigation.PushAsync(new ReportPage(ReportId, Rows));

When I press the Back button on the Report page I see the Conditions Page in Portrait, however the width is much larger than the device screen and I can only see the first two columns /the third one is not visible/.

I have an attribute on the Conditions Activity as follows:

 [Activity(Label = "Report Conditions", Icon = "@drawable/icon", Theme = "@style/MainTheme", MainLauncher = false, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation,
    ScreenOrientation = ScreenOrientation.Portrait)]

and on the Report Activity:

[Activity(Label = "Report", Icon = "@drawable/icon", Theme = "@style/MainTheme", MainLauncher = false, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation,
    ScreenOrientation = ScreenOrientation.Landscape)]

also I have added custom page renderer as follows:

For the Conditions Activity:

 public class ConditionsCustomContentPageRenderer : Xamarin.Forms.Platform.Android.PageRenderer
    {
        //private ScreenOrientation _previousOrientation = ScreenOrientation.Unspecified;

        protected override void OnWindowVisibilityChanged(ViewStates visibility)
        {
            base.OnWindowVisibilityChanged(visibility);

            var activity = (Activity)Context;

            if (visibility == ViewStates.Gone)
            {
                // Revert to previous orientation
                activity.RequestedOrientation = ScreenOrientation.Portrait;
                //_previousOrientation == ScreenOrientation.Unspecified ? ScreenOrientation.Portrait : _previousOrientation;
            }
            else if (visibility == ViewStates.Visible)
            {
                //if (_previousOrientation == ScreenOrientation.Unspecified)
                //{
                //    _previousOrientation = activity.RequestedOrientation;
                //}

                activity.RequestedOrientation = ScreenOrientation.Portrait;
            }
        }
    }

For the Report Activity:

public class ReportCustomContentPageRenderer : Xamarin.Forms.Platform.Android.PageRenderer
    {
        private ScreenOrientation _previousOrientation = ScreenOrientation.Unspecified;

        protected override void OnWindowVisibilityChanged(ViewStates visibility)
        {
            base.OnWindowVisibilityChanged(visibility);

            var activity = (Activity)Context;

            if (visibility == ViewStates.Gone)
            {
                // Revert to previous orientation
                activity.RequestedOrientation = _previousOrientation == ScreenOrientation.Unspecified ? ScreenOrientation.Portrait : _previousOrientation;
            }
            else if (visibility == ViewStates.Visible)
            {
                if (_previousOrientation == ScreenOrientation.Unspecified)
                {
                    _previousOrientation = activity.RequestedOrientation;
                }

                activity.RequestedOrientation = ScreenOrientation.Landscape;
            }
        }
    }

I am missing something, but I am not sure what exactly.

Any help is greatly appreciated!

2
  • 1
    If you use ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation, it ignores the xml in "layout-land", if you created different xml for landscape in "layout-land", don't use this tag.
    – Grace Feng
    Apr 3, 2017 at 2:10
  • Thank you for your comment @GraceFeng-MSFT. I figured the problem is not with the layout, since the ConditionsPage is always in Portrait. However the width of the page extends past the screen size. Is there any way to set the page width to be equal to that of the width of the device screen? Apr 6, 2017 at 6:17

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy