JPLinearLayoutView example

JPLinearLayoutView is a class I wrote for Objective-C that resembles, in many ways at least, Android’s layout view (though I strip a lot of things out for simplicity).

It’s super easy to use! Here is an example of JPLinearLayoutView used as a stacked layoutView. This layout will be horizontal, but layoutView by default is vertical.

JPLinearLayoutView *layoutView = [[JPLinearLayoutView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:layoutView];

// Padding
layoutView.padding = UIEdgeInsetsMake(5, 5, 5, 5);

// Default orientation is vertical
layoutView.orientation = JPLinearLayoutViewOrientationHorizontal;

// Since layoutView subclasses scrollView, you get to decide this
layoutView.bounces = NO;

// Add views
JPLinearLayoutItem *profileImageItem = [JPLinearLayoutItem itemForView:_profileImageView];

// default is center.  JPLinearLayoutItem also supports top / bottom for horizontal layout and left / right for vertical layout, stretch / center for either
profileImageItem.alignment = JPLinearLayoutItemAlignmentTop;
profileImageItem.margin = UIEdgeInsetsMake(5, 5, 5, 5);

// We have set the size we want for this image, so we're going to turn off autosizing. Autosize would use sizeThatFits on the view if it was the default value, YES
profileImageItem.autoSizes = NO;

JPLinearLayoutItem *usernameItem = [JPLinearLayoutItem itemForView:_usernameLabel];
usernameItem.margin = UIEdgeInsetsMake(5, 5, 5, 5);

// Set the items of the layoutView
layoutView.items = @[profileImageItem, usernameItem];

// And we're done!

JPLinearLayoutView also supports a fitted layout, that uses ‘weight’ to lay things out. This layout modeputs all of the items within the bounds of the view (no scrolling!)
Here’s an example:

JPLinearLayoutView *layoutView = [[JPLinearLayoutView alloc] initWithFrame:self.view.bounds];

// Padding
layoutView.padding = UIEdgeInsetsMake(5, 5, 5, 5);

// Set the mode to 'fitted'
layoutView.mode = JPLinearLayoutViewModeFitted;

[self.view addSubview:layoutView];

// Some quick items, look at the above example to see the neat things you can do to modify a linearLayoutItem

JPLinearLayoutItem *item1 = [JPLinearLayoutItem itemForView:_view1];

// A stretchable space between item 1 and 2
JPLinearLayoutItem *spacer1 = [JPLinearLayout itemWithWeight:4];

JPLinearLayoutItem *item2 = [JPLinearLayoutItem itemForView:_view2];

// To make this gap twice as long as the previous one, we'll need to set the weight twice as high
JPLinearLayoutItem *spacer2 = [JPLinearLayout itemWithWeight:8];

JPLinearLayoutItem *item3 = [JPLinearLayoutItem itemForView:_view3];

layoutView.items = @[item1, spacer1, item2, spacer2, item3];

// And we're done!

JPLinearLayoutView is part of JPKit and can be found on Github by clicking here.

It is currently still in development, but feel free to use it and report any issues you find on Github!

JPLinearLayoutView example

- JP -