CODEWITHSUNDEEP
iosxamarinxamarin.ios
JensB
JensB

Reputation: 6850

Resolution independence in Xamarin for iOS

I'm taking a few first steps in Xamarin for iOS and having a very hard time figuring out how to create a view that is resolution independent.

I have a single textbox in the view, aligned so that its edges meet the edge of a iPhone 6S. When I change the View to a Iphone 4S the edges of the textbox are outside of the view.

I have tried to drag the constrains to the edges, pretty much clicked every button and tried to find some example of how to make it so the view resizes to fit the viewport but I cannot make it work. Ive also fiddled with the different modes of the View (Aspect Fit, Scale to Fill, etc) but that makes no difference.

I would love to se a simple example of how to create a resolution independent or multi-resolution form or view that is displayed similarily no matter the screen resolution on the iPhone.

Upvotes: 0

Views: 78

Answers (1)

Marakai
Marakai

Reputation: 1212

Having gone through very much the same pain as you, my recommendation is two-fold:

  1. Have a look at the Cirrious FluentLayouts package, which you can get from NuGet.

A tremendous help in simplifying various issues with auto-layout, especially if you decide (like I did) to just give up on the GUI layout tools and go with a full programmatic approach.

It will allow constructs like:

this.AddConstraints
(
    _navBar.AtTopOf(this, UIApplication.SharedApplication.StatusBarFrame.Height),
    _navBar.AtLeftOf(this),
    _navBar.WithSameWidth(this),
    _navBar.Height().EqualTo(Hamburger.HamburgerHeight),

    _scrollView.Below(_navBar),
    _scrollView.AtLeftOf(this),
    _scrollView.WithSameWidth(this),
    _scrollView.Bottom().EqualTo().TopOf(_pageControl),

    _pageControl.Above(_toolBar),
    _pageControl.AtLeftOf(this),
    _pageControl.WithSameWidth(this),
    _pageControl.Height().EqualTo(pageControlHeight),

    _toolBar.Above(_button),
    _toolBar.AtLeftOf(this),
    _toolBar.WithSameWidth(this),
    _toolBar.Height().EqualTo(toolHeight),

    _button.AtRightOf(this),
    _button.AtBottomOf(this),
    _button.Height().EqualTo(buttonHeight)
);
  1. Be aware that since... iOS 8 I believe? ... you now need to use a LaunchScreen.xib to have your app correctly pick up device resolution which will then be used by auto-layout.

This was the one area I still needed to use the graphical layout tool for - just once, happy to say.

Upvotes: 1

Related Questions