Skip to content

Instantly share code, notes, and snippets.

@JoseMiralles
Last active July 14, 2019 22:01
Show Gist options
  • Save JoseMiralles/f72d1fa71c44f4b564385c0fcc0df246 to your computer and use it in GitHub Desktop.
Save JoseMiralles/f72d1fa71c44f4b564385c0fcc0df246 to your computer and use it in GitHub Desktop.
Example of using autolayout programmatically in Xamarin.iOS
public partial class ViewController : UIViewController
{
#region properties
// Top Views setup
private readonly UITextView textView = new UITextView
{ TranslatesAutoresizingMaskIntoConstraints = false };
private readonly UIView topImageContainer = new UIView
{ TranslatesAutoresizingMaskIntoConstraints = false };
private readonly UIImageView imageView = new UIImageView {
TranslatesAutoresizingMaskIntoConstraints = false,
Image = UIImage.FromFile("clover.png"),
ContentMode = UIViewContentMode.ScaleAspectFit //Mantian aspect ratio
};
//Bottom Controls Layout Setup
private readonly UIButton previousButton = new UIButton(UIButtonType.System)
{ TranslatesAutoresizingMaskIntoConstraints = false };
private readonly UIButton nextButton = new UIButton(UIButtonType.System)
{ TranslatesAutoresizingMaskIntoConstraints = false };
private readonly UIPageControl uIPageControl = new UIPageControl()
{
CurrentPage = 0,
Pages = 4,
CurrentPageIndicatorTintColor = UIColor.Green,
PageIndicatorTintColor = UIColor.LightGray
};
private UIStackView bottomControlsStackView;
#endregion
public override void ViewDidLoad()
{
base.ViewDidLoad();
this.SetUpBottomControlls();
this.SetupLayout();
}
/// <summary>
/// Generates the top layout
/// </summary>
private void SetupLayout()
{
View.AddSubview(textView);
View.AddSubview(topImageContainer);
topImageContainer.AddSubview(imageView);
//Add the text and the sub text.
NSMutableAttributedString attributedText = //NS'Mutable'AttributedString can be appended to.
new NSMutableAttributedString( //Constructor with multiple optional params
str: "Join us for some fun!",
font: UIFont.BoldSystemFontOfSize(18));
//This attributed string gets appended to attributedText so that only one UITextView is needed.
NSAttributedString attribtedSubText =
new NSAttributedString(
str: "\n\n\nAre you ready for loads and loads of fun? Don't wait any longer! We hope to see you in our stroes soon.",
font: UIFont.SystemFontOfSize(13),
foregroundColor: UIColor.DarkGray);
attributedText.Append(attribtedSubText); //One single string now has multiple subs strings with diferent styles.
textView.AttributedText = attributedText; //Make sure that the string is already appended before adding it to the textview.
textView.TextAlignment = UITextAlignment.Center;
textView.Editable = false;
textView.ScrollEnabled = false;
// Make imageViewContainer occupy the top half of the screen.
topImageContainer.TopAnchor.ConstraintEqualTo(View.TopAnchor).Active = true;
topImageContainer.TrailingAnchor.ConstraintEqualTo(View.TrailingAnchor).Active = true;
topImageContainer.LeadingAnchor.ConstraintEqualTo(View.LeadingAnchor).Active = true;
topImageContainer.HeightAnchor.ConstraintEqualTo(View.HeightAnchor, 0.5f).Active = true; //Second argument acts as a percentage float multiplier.
// Layout imageView in realtion to the XYcenter anchors of topImageViewContainer.
imageView.CenterYAnchor.ConstraintEqualTo(topImageContainer.CenterYAnchor).Active = true;
imageView.CenterXAnchor.ConstraintEqualTo(topImageContainer.CenterXAnchor).Active = true;
imageView.HeightAnchor.ConstraintEqualTo(topImageContainer.HeightAnchor, 0.6f).Active = true;
textView.TopAnchor.ConstraintEqualTo(topImageContainer.BottomAnchor).Active = true;
textView.LeadingAnchor.ConstraintEqualTo(View.LeadingAnchor, 24).Active = true; //Anchor with offset
textView.TrailingAnchor.ConstraintEqualTo(View.TrailingAnchor, -24).Active = true; //Negative means to the left.
}
/// <summary>
/// Generates the navigation controlls at the bottom.
/// </summary>
private void SetUpBottomControlls()
{
previousButton.SetTitle("PREV", UIControlState.Normal);
previousButton.TitleLabel.Font = UIFont.BoldSystemFontOfSize(14);
previousButton.SetTitleColor(UIColor.DarkGray, UIControlState.Normal);
nextButton.SetTitle("NEXT", UIControlState.Normal);
nextButton.TitleLabel.Font = UIFont.BoldSystemFontOfSize(14);
nextButton.SetTitleColor(UIColor.Green, UIControlState.Normal);
bottomControlsStackView = new UIStackView //Child views need to be added during assignation.
(views: new UIView[] { previousButton, uIPageControl, nextButton })
{
TranslatesAutoresizingMaskIntoConstraints = false,
Distribution = UIStackViewDistribution.FillEqually
};
View.AddSubview(bottomControlsStackView);
//Alternative way of activating constraints.
NSLayoutConstraint.ActivateConstraints(new NSLayoutConstraint[] {
//Top Stack View
bottomControlsStackView.BottomAnchor.ConstraintEqualTo(View.SafeAreaLayoutGuide.BottomAnchor),//Safe Area Bottom Anchor
bottomControlsStackView.LeadingAnchor.ConstraintEqualTo(View.SafeAreaLayoutGuide.LeadingAnchor),
bottomControlsStackView.TrailingAnchor.ConstraintEqualTo(View.SafeAreaLayoutGuide.TrailingAnchor),
bottomControlsStackView.HeightAnchor.ConstraintEqualTo(50)
});
}
public ViewController(IntPtr handle) : base(handle) { }
public override void DidReceiveMemoryWarning()
{
base.DidReceiveMemoryWarning();
// Release any cached data, images, etc that aren't in use.
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment