IMD 1_To Do List (4)

This is our final class of making ‘to do list’ app.

Now we will going to add a background image, set the color of cells and details of fonts.

First, bring the image you want to put in the background.

Just drag it to the Assets.xcassets. And change its name to ‘bgimage’.

스크린샷 2016-05-08 오전 11.47.48.png

Than go to the listTableViewController.swift, and we will add some code.

We can change the cell’s height.

스크린샷 2016-05-11 오후 5.00.02.png

KakaoTalk_Photo_2016-05-11-16-58-25.png

And we can also change the background color.

스크린샷 2016-05-11 오후 5.00.12.png

But I’m going to set our background image. So I wrote ‘//’ in front of that code.

To set your own background image, write this code.

스크린샷 2016-05-11 오후 5.00.19.png

Let’s customize our cell more specifically.

First, we can add a color of our cell.

스크린샷 2016-05-11 오후 5.20.22.png

KakaoTalk_Photo_2016-05-11-16-58-22.png

If you want to make it transparent, you can change the number of  alpha. The cell gets transparent when the alpha number gets lower.

You can also make some pattern of cells bg color.

스크린샷 2016-05-11 오후 5.21.22.png

This code make pattern of cells.

KakaoTalk_Photo_2016-05-11-16-58-18.png

You can find that the background is transparent, but the title and subtitle is still same.

We will going to fix that.

스크린샷 2016-05-11 오후 5.28.02

KakaoTalk_Photo_2016-05-11-16-58-15

You can also change the color of fonts.

스크린샷 2016-05-11 오후 5.29.33.png

KakaoTalk_Photo_2016-05-11-16-58-11.png

You can change the size of font, the style of font (Italic) and the boldness.

스크린샷 2016-05-11 오후 5.30.58.png

KakaoTalk_Photo_2016-05-11-16-58-07.png

I set the size of title font is ‘18.0’ and subtitle font is ‘9.0’.

KakaoTalk_Photo_2016-05-11-16-57-54.png

I also made the font italic.

So nice!!

There’s so many way to customize your own unique ‘To Do List’ app.

 

 

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s