KTUI

This group provides subclasses of native views or new UI elements entirely, and are designed to make nice UI development easier. By using convenient constructor methods and/or easy to manipulate attributes, you can create very nice-looking elements without having to generate your own graphics or do any custom coding. These elements are designed to be fully customizable, again through convenient methods, so they match the look and feel of your app.

KTUI Classes

• KTAlert
• KTButton
• KTImageView
• KTLoader
• KTProgressIndicator
• KTTextField

---

KTAlert

Not designed to replace UIAlertView, but rather to provide alternative (usually passive) options for giving users notice. KTAlert is subclassed into multiple different view types, all of which are fully customizable - both in design, how long the alert is shown for, and animation types.

KTAlertToast

Design based on the Android toast mechanism, this box fades in and out in a manner shown here:

[](images/ktalerttoast-ex1.png)
Basic implementation can be simple (see full documentation for customization options):

[KTAlert showAlert:KTAlertTypeToast
       withMessage:@"Unable to log in - verify your credentials"
       andDuration:KTAlertDurationLong];

KTAlertBar

Designed to passively notify the user that something happened without blocking the entire UI or requiring action. Defaults to slide in the top of the screen, as shown here:

[](images/ktalertbar-ex1.png)
Basic implementation can be simple (see full documentation for customization options):

[KTAlert showAlert:KTAlertTypeBar
       withMessage:@"Unable to log in - verify your credentials"
       andDuration:KTAlertDurationLong];

---

KTButton

Created to make nice-looking buttons easier to create, this class requires no graphic resources and does all drawing through code. The design helps the button 'pop' off the screen.This class comes complete with touch effects.

All you need to do is pass in one or more background colors - the class will take care of the rest. Check out the example below:

[](images/ktbutton-ex1.png)
Basic implementation can be simple (see full documentation for customization options):

KTButton *myButton = [ [KTButton alloc] initWithFrame:frame 
                                   andGradientColors:lightGreen, darkGreen, nil];

---

KTImageView

Created specifically for Kii Cloud usage, this subclass of UIImageView will asynchronously download and display an image that is stored in Kii Cloud. Simply pass in a KiiFile object and the class will take care of the rest. Includes callback blocks (when desired) as well as a progress bar.

As with all classes, this is fully customizable and you can read more in the full documentation - but the simplest use case is as follows:

CGRect frame = CGRectMake(20, 20, 50, 50);
KiiFile *myFile = [KiiFile fileWithURI:@"<my-object-uri>"];

KTImageView *imageView = [KTImageView createWithFrame:frame andKiiFile:myFile];
[self.view addSubview:imageView];
[imageView show];

For a complete tutorial for KTImageView (including sample code), check out Kii Cloud's documentation here

---

KTLoader

A loading view, this was designed to nicely show that an asynchronous action is taking place. While shown, the entire window is unavailable for user interaction.

This is especially useful for network connections and long operations that shouldn't be interfered with. See example:

[](images/ktloader-ex1.png)

See the full documentation for customization options

Basic implementation can be as simple as:

[KTLoader showLoader:@"Logging in..."];

Or you can make a more complex loader like this:

[](images/ktloader-ex2.png)

Using the following code:

[KTLoader showLoader:@"Successfully loaded!"
            animated:TRUE
       withIndicator:KTLoaderIndicatorSuccess
     andHideInterval:KTLoaderDurationAuto];

Finally, you can make a progress loader as shown:

[](images/ktloader-ex3.png)

Using the following code:

[KTLoader showLoader:@"Loading..."
            animated:TRUE
       withIndicator:KTLoaderIndicatorProgress];
       
// set to some double from [0,1]
[KTLoader setProgress:0.65];

---

KTProgressIndicator

A UI element that displays a progress indicator. This class is skinnable with a few default types to get you started. It is meant to be a nicer-looking, more customizable solution to the standard iOS UIProgressView

For creating a standard, skinnable progress bar like this:

[](images/ktprogress-bar.png)

use the following code:

// define a frame
CGRect frame = CGRectMake(110, 200, 100, 30);

// create the progress bar
KTProgressIndicator *bar = [ [KTProgressIndicator alloc] initWithFrame:frame];
[self.view addSubview:bar];

// set the progress [0,1]
[bar setProgress:0.45];

To create a circular 'pie' loader as shown:

[](images/ktprogress-pie.png)

use the following code:

// define a frame
CGRect frame = CGRectMake(130, 180, 60, 60);

// create the progress indicator
KTProgressIndicator *pie = [ [KTProgressIndicator alloc] initWithFrame:frame andType:KTProgressIndicatorTypeCircular];
[pie.circularProgressIndicator setFillColor:[UIColor lightGrayColor]];
[pie.circularProgressIndicator setStrokeColor:[UIColor lightGrayColor]];
[self.view addSubview:pie];

// set the progress [0,1]
[pie setProgress:0.65];

---

KTTextField

A subclass of UITextField, this field provides some nice UI upgrades. Currently supporting a border as well as a background glow when the field is selected, this class will have plenty more features to come. See example:

[](images/kttextfield-ex1.png)
Basic implementation can be simple (see full documentation for customization options):

KTTextField *myField = [KTTextField textFieldWithFrame:frame
                                        andBorderColor:lightOrange
                                              andGlows:TRUE];
[self.view addSubview:myField];