effective UI styling for iOS app [closed]

Question

My question is a simple one. In android, we can separate xml stylesheet from layout so that it can be reuse everywhere and edited easily for UI design change.

Is it also possible in iOS xcode? if can how (prefer if not from controller)? need libraries? what are good libraries for that?

Thank you for your answer.

Gielgud

Subclassing UI components? – Ingaborg

you can use category class for that purpose . – Tappet

Answer 1

you can use UICategory class for UIView for that purpose. create different methods for set borders, border colors , pass bazier-paths, corner radius and so many . this is just few of them. category is of UIView so you can use on buttons,lables,textview,textedits etc;

UIView+category.h

@interface UIView (category)
-(void)makeToRoundEdgeWithBorder:(CGFloat )borderwidth bordecolor:(UIColor *)color;

@end

UIView+category.m

@implementation UIView (category)

-(void)makeToRoundEdgeWithBorder:(CGFloat )borderwidth bordecolor:(UIColor *)color
{
   NSLog(@"height %f width %f",CGRectGetHeight(self.frame),CGRectGetWidth(self.frame));
    self.layer.cornerRadius=CGRectGetHeight(self.frame)/2;
    self.layer.masksToBounds=YES;
    self.layer.borderColor=[color CGColor];
    self.layer.borderWidth=borderwidth;
}

@end

Use it

[yourlable makeToRoundEdgeWithBorder:0.0f bordercolor:[UIColor clearColor] cornerRadius:8.0f];

[yourbutton makeToRoundEdgeWithBorder:0.0f bordercolor:[UIColor clearColor] cornerRadius:8.0f];

[yourTextview makeToRoundEdgeWithBorder:0.0f bordercolor:[UIColor clearColor] cornerRadius:8.0f];

[yourTextfield makeToRoundEdgeWithBorder:0.0f bordercolor:[UIColor clearColor] cornerRadius:8.0f];

Tappet

This isn't Swift - As it's accepted answer, not sure what OP is asking for, maybe provide Swift extension examples too. – Stieglitz

Just to avoid confusion, especially for beginner programmers, a category is not a class. In fact, there is no such thing as UICategory. Categories are merely a way of adding new functionality to existing classes. – Roodepoortmaraisburg

Answer 2

You could create your own styles using enums. By placing enums inside the Styles enum you get a nice grouping:

enum Styles {
    enum Labels {
        case Standard
        case LargeText

        func style(label: UILabel) {
            switch self {
            case .Standard:
                label.font = UIFont.systemFontOfSize(12)
            case .LargeText:
                label.font = UIFont.systemFontOfSize(18)
            }
        }
    }

    enum Buttons {
        case RedButton

        func style(button: UIButton) {
            switch self {
            case .RedButton:
                button.setTitleColor(UIColor.redColor(), forState: UIControlState.Normal)
            }
        }
    }
}

Then you can use it like this:

Styles.Labels.Standard.style(yourLabel)

You can also then make extensions for the styles you have setup:

extension UILabel {
    func style(style: Styles.Labels) {
        style.style(self)
    }
}

extension UIButton {
    func style(style: Styles.Buttons) {
        style.style(self)
    }
}

And then use the extensions like this:

yourLabel.style(.Standard)
yourButton.style(.RedButton)

Yerkovich

Answer 3

You should also look into UIAppearance. It's a design proxy available for most UI elements where you only set the styling once.

Roodepoortmaraisburg

Answer 4

You can use Classy to define a styles for your UI in a more CSS like fashion. It's used and maintained byt the people at Wire

Bonnybonnyclabber

Thanks! Clicked on that out of curiosity. First line in the Readme file says NOTICE: Classy is no longer actively maintained see: Looking for contributors Therefore maybe not really a good choice. – Odalisque

As I said it is actively maintained. I know for a fact :) github.com/ClassyKit/Classy/issues/108 – Bonnybonnyclabber

As you can see the last pull request merged was 22nd of December 2015 by mikeger which works at the company I mentioned. Neither the company not the framework are going to disappear soon. I have no interest in you using it but I can vouch for it's quality. – Bonnybonnyclabber

Okay, sounds legit. Maybe the next commit should be removing that line in the Readme then. I'll give it a try! :) Thanks! – Odalisque