3.3 Support Libraries

Task 1: Set up your project to use support libraries

• In Android Studio, select Tools > Android > SDK Manager.
• Click the SDK Tools tab and expand Support Repository, as shown in the figure below.
• Look for Android Support Repository in the list.
• Look for Android Support Repository in the list.

Set up the project and examine build.gradle

• Create a new project called HelloCompat.
• Click Next, and choose the Empty Activity template.
• Click Next, and ensure that the Generate Layout file and Backwards Compatibility (App Compat) options are checked.
• Click Finish.

• In Android Studio, make sure the Project > Android pane is open.
• Expand Gradle Scripts and open the build.gradle (Module: app) file

• In Android Studio, make sure the Project > Android pane is open.
• Expand Gradle Scripts and open the build.gradle (Module: app) file.
• Locate the compileSdkVersion line near the top of the file

• Locate the minSdkVersion line in the defaultConfig section a few lines down.

• Locate the targetSdkVersion line in the defaultConfig section. For example:

• Locate the dependencies section of build.gradle, near the end of the file.
• Update the version numbers, if necessary.
• Update the compileSdkVersion number, if necessary.
• Click Sync Now to sync your updated Gradle files with the project, if prompted.
• Install missing SDK platform files, if necessary.

Task 2 Implement the layout and MainActivity

1. Open activity_main.xml in the Project > Android pane.
2. Click the Design tab (if it is not already selected) to show the layout editor.
3. Select the “Hello World” TextView in the layout and open the Attributes pane.
4. Change the TextView attributes as follows:
5. Delete the constraint that stretches from the bottom of the hello_textview TextView to the bottom of the layout, so that the TextView snaps to the top of the layout, and choose 8 (8dp) for the top margin as shown below.

6. Drag a Button to the bottom of the layout, and add constraints to the left and right sides and bottom of the layout, as shown in the figure below.

7. Change the layout_width attribute in the Attributes pane for the Button to match_constraint.

8. Change the other attributes in the Attributes pane for the Button as follows:

9. In a previous lesson you learned how to extract a string resource from a literal text string. Click the Text tab to switch to XML code, and extract the "Hello Text!" and "Change Color" strings in the TextView and Button, and enter string resource names for them.

10. Add the following android:onClick attribute to the Button:

android:onClick="changeColor"

11. To add colors, expand res and values in the Project > Android pane, and open colors.xml.

12. Add the following color resources to the file:

<color name="red">#F44336</color>
<color name="pink">#E91E63</color>
<color name="purple">#9C27B0</color>
<color name="deep_purple">#673AB7</color>
<color name="indigo">#3F51B5</color>
<color name="blue">#2196F3</color>
<color name="light_blue">#03A9F4</color>
<color name="cyan">#00BCD4</color>
<color name="teal">#009688</color>
<color name="green">#4CAF50</color>
<color name="light_green">#8BC34A</color>
<color name="lime">#CDDC39</color>
<color name="yellow">#FFEB3B</color>
<color name="amber">#FFC107</color>
<color name="orange">#FF9800</color>
<color name="deep_orange">#FF5722</color>
<color name="brown">#795548</color>
<color name="grey">#9E9E9E</color>
<color name="blue_grey">#607D8B</color>
<color name="black">#000000</color>

1. Open MainActivity.
2. Add a private variable at the top of the class to hold the TextView object.

private TextView mHelloTextView;

3. Add the following color array just after the private variable:

private String[] mColorArray = {"red", "pink", "purple", "deep_purple",
          "indigo", "blue", "light_blue", "cyan", "teal", "green", 
          "light_green", "lime", "yellow", "amber", "orange", "deep_orange",
          "brown", "grey", "blue_grey", "black" };

Each color name corresponds to the name of a color resource in color.xml.

5. Also in onCreate(), restore the saved instance state, if any:

// restore saved instance state (the text color)
if (savedInstanceState != null) {
    mHelloTextView.setTextColor(savedInstanceState.getInt("color"));
}

6. Add the onSaveInstanceState() method to MainActivity to save the text color:

@Override
public void onSaveInstanceState(Bundle outState) {
    super.onSaveInstanceState(outState);
    // save the current text color
    outState.putInt("color", mHelloTextView.getCurrentTextColor());
}

7. Add the onSaveInstanceState() method to MainActivity to save the text color:

@Override
public void onSaveInstanceState(Bundle outState) {
    super.onSaveInstanceState(outState);
    // save the current text color
    outState.putInt("color", mHelloTextView.getCurrentTextColor());
}

Task 3 : Implement Button behavior

1. Open activity_main.xml, if it is not already open. Click the Text tab to show the XML code.
2. Click on "changeColor" in the android:onClick attribute inside the Button element.
3. Press Alt+Enter (Option+Enter on a Mac), and select Create onClick event handler.
4. Choose MainActivity and click OK.

This creates a placeholder method stub for the changeColor() method in MainActivity:

public void changeColor(View view) {
}

Implement the button action

1. Switch to MainActivity.
2. In the changeColor() method, create a random number object by using the Random class (a Java class) to generate simple random numbers.

Random random = new Random();

3. Use the random instance to pick a random color from the mColorArray array:

String colorName = mColorArray[random.nextInt()

4. Get the resource identifier (an integer) for the color name from the resources:

int colorResourceName = getResources().getIdentifier(colorName,
          "color", getApplicationContext().getPackageName();

5. Get the integer ID for the actual color from the resources and assign it to a colorRes variable, and use the getTheme() method to get the theme for the current application context.

int colorRes = 
   getResources().getColor(colorResourceName, this.getTheme());

6. Change the colorRes assignment line to use the ContextCompat class:

int colorRes = ContextCompat.getColor(this, colorResourceName);

7. Set the color of the TextView to the color resource ID:

mHelloTextView.setTextColor(colorRes);

8. Run the app on a device or emulator, and click the Change Color Button.