Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
In this video we'll see how we can save and restore the state of the CheckBoxes!
Related Links
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
We just finished up the layout
of our ingredients fragment
0:00
by adding a check box for each ingredient.
0:03
We also saw that rotating the app
caused us to lose all of our checks.
0:05
So what we need to do is save the state of
our check boxes when the fragment is being
0:09
destroyed, and then restore that
state when it's being created again.
0:14
Let's start with saving
the state of our check boxes.
0:19
But before we can do that, we'll need to
be able to access our check boxes from
0:22
outside of the setUpCheckBoxes method.
0:26
At the top of the class, let's create
a new array of CheckBoxes as a field.
0:29
Private CheckBox array, and
0:37
let's name it mCheckBoxes.
0:42
Then in onCreateView, right after
we create the ingredients array,
0:46
let's initialize mCheckBoxes to
be a new array of CheckBoxes
0:51
with the same length as
our ingredients array.
0:55
mCheckBoxes equals new
0:58
CheckBox array with the same
length of our ingredients array.
1:02
Next, at the top of
the setUpCheckBoxes method,
1:10
let's create a new int named i and
set it equal to 0.
1:14
We'll use this to iterate
through our mCheckBoxes array.
1:22
Then inside the for each loop, instead
of creating a new CheckBox variable,
1:26
let's use our mCheckBoxes array and
pass in i for the index.
1:33
Then let's copy this and paste it over
the remaining CheckBox variables.
1:42
Finally, at the bottom of the loop,
1:53
let's increment i by 1 to
move on to the next index.
1:55
Now let's get back to saving
the state of our check boxes.
2:01
Just like activities, fragments also
have an onSaveInstanceState method.
2:04
Let's add a line below setUpCheckBoxes.
2:10
And use Ctrl+O to override it.
2:15
saveInstanceState.
2:19
Then let's add a line at the top.
2:22
Then let's create a boolean array to
store the state of each CheckBox,
2:26
true for checked and false for unchecked.
2:32
Let's name this array stateOfCheckBoxes,
and
2:36
set it equal to a new boolean array
with the same length as mCheckBoxes.
2:42
Now we need to loop through our
CheckBoxes, and if a check box is checked,
2:53
we need to set its corresponding
entry in stateOfCheckBoxes to true.
2:58
So just like above, let's create
an int named i and set it equal to 0.
3:03
Then let's loop through each
CheckBox in mCheckBoxes.
3:11
For CheckBox checkBox in mCheckBoxes.
3:16
And inside this loop,
let's set stateOfCheckBoxes
3:23
at index i equal to checkBox.isChecked(),
3:28
which works exactly as you would expect.
3:34
Then let's increment i
by 1 on the next line.
3:40
And now, after this loop has ran,
our stateOfCheckBoxes array will be up
3:45
to date with what's actually
in the check boxes.
3:49
All that's left is to put this array
into the provided Bundle, outState.
3:53
Let's add a line below the loop.
3:59
And type outState.putBooleanArray.
4:03
Then for the key let's type, in all caps,
4:08
KEY_CHECKED_BOXES, and then let's
pass in our stateOfCheckBoxes array.
4:11
Then let's use Alt+Enter
to create the key,
4:19
and set it equal to key_checked_boxes.
4:23
All right.
4:33
That covers saving the state.
4:34
Now we just need to restore it as well.
4:35
Back in the onCreateView method,
4:38
right below where we set mCheckBoxes,
4:42
let's create a new boolean array named
4:46
checkedBoxes to store any
saved instance state.
4:50
And let's set it equal to a new boolean
array with the same length as mCheckBoxes.
4:55
Now we need to populate the checkedBoxes
array with the data we saved, but
5:08
only if there really is saved data.
5:12
On the next line, let's create an if
statement to make sure that our saved data
5:15
exists before we try to access it.
5:20
Let's type if savedInstanceState
is not equal to null,
5:23
to first check that there
is a saved instance state.
5:29
And to make sure that our array is
included in that saved instance state,
5:34
let's type, and
savedInstanceState.getBooleanArray,
5:40
pass in our key and
check that it's not null as well.
5:45
And remember that thanks
to short-circuiting,
5:54
if saved instance state is null, this
second condition will never be evaluated.
5:57
So we're in no danger of
calling getBooleanArray
6:03
on a null savedInstantState.
6:06
Finally, inside the if statement,
let's set our checkedBoxes array
6:09
equal to the boolean array
from our savedInstanceState.
6:14
GetBooleanArray(KEY_CHECKED_BOXES).
6:21
Now that we've retrieved the saved state,
6:27
all that's left is
updating the check boxes.
6:29
Let's add our checkedBoxes array as
the third parameter to setUpCheckBoxes.
6:32
Then let's use Alt+Enter to add
it to the method's signature.
6:41
Then, in the ingredients loop,
right below where we add the view,
6:47
let's determine if a check
box should be checked.
6:51
If checkedBoxes i.
6:55
And if it should be, let's check it.
7:03
mCheckBoxes at position i dot toggle.
7:06
We're finally saving and
restoring the state of our check boxes.
7:13
But before we get to testing, there's one
fragment method we haven't covered yet
7:17
that you should know about.
7:21
And that method is setRetainInstance and
it takes in a boolean.
7:23
If we call setRetainInstance and
pass in true,
7:28
our fragment's instance will be
retained even if we rotate the phone.
7:32
But onCreateView will still be called,
so it's not super helpful in this case.
7:36
But if you'd like to learn more, check out
the link in the teacher's notes below.
7:41
Now let's test the app and
see if we've fixed the issue.
7:46
I'll click Pancakes.
7:53
Then click a few ingredients.
7:55
Yeah, I added the milk.
7:57
Then let's rotate it.
7:59
And great job!
8:02
But what's this?
8:04
I can't seem to scroll down to
see these bottom ingredients.
8:06
We'll see how to fix
this in the next video.
8:10
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up