Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Start a free Basic trial
to watch this video
Let's continue with adding additional colors as the background for each new fun fact. We'll add a new Java object to hold the colors and serve one up on each tap of the button!
Color codes (from the style guide)
val colors = arrayOf(
"#39add1", // light blue
"#3079ab", // dark blue
"#c25975", // mauve
"#e15258", // red
"#f9845b", // orange
"#838cc7", // lavender
"#7d669e", // purple
"#53bbb4", // aqua
"#51b46d", // green
"#e0ab18", // mustard
"#637a91", // dark gray
"#f092b0", // pink
"#b7c0c7" // light gray
)
Documentation
-
0:00
It's finally time to add colors to our app.
-
0:03
Let's create a new class called ColorWheel, that stores our colors and
-
0:07
picks new ones for us.
-
0:08
It'll be very similar to our FactBook class.
-
0:12
In the project name, let's right-click on the package name and
-
0:16
select New > Kotlin File/Class.
-
0:19
Let's name it ColorWheel.
-
0:22
Make it a class instead of a file, and hit Enter.
-
0:26
Now we're going to copy and past our code from our FactBook class and
-
0:29
make a few key changes.
-
0:32
Let's switch over to our FactBook class.
-
0:35
Then let's select everything after the word,
-
0:38
FactBook then use Cmd, or Ctrl+C to copy it.
-
0:41
Then let's go back to the ColorWheel class,
-
0:44
select everything after the word ColorWheel.
-
0:47
Then use Cmd, or Ctrl+V to paste it back in.
-
0:52
Android Studio then notices that we're missing an import.
-
0:55
We didn't copy the import statement form our FactBook class,
-
0:57
which means it didn't get pasted here.
-
1:00
Hit OK to generate the import, and now we're good to go.
-
1:04
Instead of facts, we'd like these to be colors.
-
1:07
Let's start by refactoring facts to be named colors.
-
1:11
Right click on facts, select Refactor > Rename.
-
1:16
Note that the keyboard shortcut is Shift+F6, and
-
1:20
then type colors and hit Enter.
-
1:24
Now I'm going to copy and paste in some colors in the form of hexadecimal strings.
-
1:30
Remember, the colors we want to use are the Treehouse topic colors from the web.
-
1:35
Here's the color sheet we looked at before.
-
1:37
There's a link in the teacher's notes below.
-
1:39
If you want, you can come to this page and individually grab each code and
-
1:43
create the array.
-
1:44
But I'll copy and paste in the array from the teachers notes to save time.
-
1:48
Okay, let's copy the array and then back in Android Studio,
-
1:52
I'm going to put this last closing parenthesis on a new line.
-
1:55
And then paste our colors array over our facts array.
-
1:59
Now, that we've got all our colors, let's make a few changes to the getFact method.
-
2:04
First off, we probably shouldn't call it getFact anymore.
-
2:08
Let's change it to getColor.
-
2:10
Since this method is never used, that's what this gray text is telling us,
-
2:14
we don't need to bother with refactoring.
-
2:16
We can just rename it the old-fashioned way.
-
2:20
Great!
-
2:21
Now the cool thing is we don't need to change anything about our randomNumber
-
2:25
generator.
-
2:26
We still use the random class and
-
2:27
still pick a random number based on the length of the array up here.
-
2:32
Though we should change the comment to say Randomly select a color.
-
2:37
Now let's get back to FunFactsActivity.
-
2:40
And the first thing we need to do is create a new ColorWheel object as
-
2:44
a property, just like we did with FaceBook.
-
2:47
Let's add a new line at the top below our FactBook and create a new private vowel
-
2:51
named colorWheel.
-
2:56
And set it equal to a new ColorWheel.
-
3:00
Now down in our on click listener,
-
3:02
we can pick a new color just like we did for the fact.
-
3:06
Let's add a couple lines after we set our fact and
-
3:12
then type val color = colorWheel.getColor().
-
3:18
Then let's use our new color variable as a parameter to
-
3:21
this setBackgroundColor method.
-
3:24
Which gives us an error.
-
3:27
If we hover over it, we'll see the we're getting a type mismatch.
-
3:31
The method expects an int, but we're giving it a string.
-
3:34
So how are we gonna make this work?
-
3:37
Well, don't worry, as usual there is this simple solution.
-
3:40
We need to convert data like this a lot in programming.
-
3:43
Remember programming is primarily about working with and manipulating data.
-
3:48
Let's take a short break, and then in the next video, we'll fix this error.
You need to sign up for Treehouse in order to download course files.
Sign up