May 6, 2024 -- Notes

To Lecture Notes

IT 372 -- May 6, 2024

Review Questions

Add a TextView widget to a constraint layout. Change the font family of the widget using the Design Layout Editor. Check out these files that are modified:
```
res/activity_main.xml      res/font/font_name.(ttf | xml)
res/values/font_certs.xml  res/values/preloaded_fonts.xml
```
Answer: Use the Design Editor to select the fontFamily attribute. You can either use one of the predefined fonts,
Set up a main activity with a Spinner containing the names of birds, and two button widgets. The first button has the caption Add Bird; the second button has the caption Display Birds in ArrayList. When first button is clicked the selected bird in the spinner is added to the arraylist. When the second button is clicked, the birds arraylist is passed to a new activity, an output string is created from the birds in the arraylist, and the output string is displayed in a textview.
Answer: Here are the app files:
activity_main.xml strings.xml MainActivity.java
activity_show_birds.xml ShowBirdsActivity.java
Set up a main activity with an arraylist to which Pet objects are added. In an Intent object, pass the arraylist to a a second display activity and display the arraylist contents on the second activity. Use Serialization to pass the activity to the intent. Serialization can also be used to put an arraylist in a Bundle object for when an activity is destroyed and recreated.
Answer: To be posted soon.

Android Platform and Architecture

Practice Problem. Find the UTF-8 representations for two non-Latin characters. Android uses this modified UTF-8 encoding system (MUTF-8) where up to three bytes may be encoded.
```
             Minimum Maximum Byte 1   Byte 2   Byte 3
             code    code
             point   point
One byte:    U+0000  U+007F  0xxxxxxx 
Two bytes:   U+0080  U+07FF  110xxxxx 10xxxxxx 
Three bytes: U+0800  U+FFFF  1110xxxx 10xxxxxx 10xxxxxx
```
In the Byte 1, Byte 2, and Byte 3 columns, x represents the binary bits of the Unicode encoding for the character; 0 and 1 represent the special UTF-8 encoding bits.
1. Find the UTF-8 representation for the Greek letter δ (lower case delta).
  1. Look up the Unicode code for δ in this document:
    https://www.unicode.org/charts/PDF/U0370.pdf
    The hex Unicode code is 03B4.
  2. Translate the hex code to binary:
```
  0    3    B    4
0000 0010 1011 0100   
```
  3. Because 03B4 is between 0080 and 07FF, use the Two Bytes row. Place the binary bits of the unicode code (represented by x in the table) into groups of five and six:
```
0000 0010 1011 0100
01010 110100  
```
  4. Add the UTF-8 encoding bits 110 and 10 from the Two Bytes row:
```
01010 110100
11001010 10110100
```
  5. Group the binary bits into groups of four and translate back to hex:
```
11001010 10110100
1100 1010 1011 0100 
  C    A    B    4
```
  Therefore the UTF-8 encoding for β is CAB4.
1. Find the UTF-8 representation for the Cyrillic letter Щ (upper case shcha).
  1. Look up the Unicode code for Щ in this document:
    https://www.unicode.org/charts/PDF/U0400.pdf
    Therefore the hex Unicode code is 0429.
  2. Translate the hex code to binary:
```
  0    4    2    9
0000 0100 0010 1001   
```
  3. Because 0429 is between 0080 and 07FF, use the Two Bytes row. Place the binary bits of the unicode code (represented by x in the table) into groups of five and six:
```
0000 0100 0010 1001   
10000 101001    
```
  4. Add the UTF-8 encoding bits 110 and 10 from the Two Bytes row:
```
10000 101001
11010000 10101001
```
  5. Group the binary bits into groups of four and translate back to hex:
```
11010000 10101001
1101 0000 1010 1001
  D    0    A    9
```
  Therefore the UTF-8 encoding for Щ is D0A9

Adding Widgets Dynamically

Sometimes it is useful not to add and configure widgets at design time (in the XML layout file), but instead to add and configure them dynamically (in the Java activity code).
For Project 4, the custom View widget of type MyView must be instantiated, configured, and dynamically added to the layout.

Here are the steps to create an app that adds a textview and a button dynamically:

Create an app with an empty activity named DynamicWidgets.
Convert the ConstraintLayout to a LinearLayout with vertical orientation.
Set the id of the linear layout to linear_layout.
At the beginning of the MainActivity class, define the String array words and the int variables numWords and wordIndex:
```
private String[ ] words = 
    {"zero", "one", "two", "three", "four"};
```

In the onCreate event handler, perform the following:

Instantiate the linear layout:

LinearLayout layout = 
    findViewById(R.id.linear_layout);

Instantiate the textview and button. Declare them as final (constant) so that they can be used in the inner class of the event handler:
```
final TextView txtWord = new TextView(this);
final Button btnNextWord = new Button(this);
```

Set the text in the widgets:

 txtWord.setText(words[wordIndex++]);
btnNextWord.setText("NEXT WORD");

Set the textSize attribute for the widgets:

 txtWord.setTextSize(
    TypedValue.COMPLEX_UNIT_SP, 24);
btnNextWord.setTextSize(
    TypedValue.COMPLEX_UNIT_SP, 24);

Let the layout parameters for the widgets:

 LinearLayout.LayoutParams params =
    new LinearLayout.LayoutParams(
        LinearLayout.LayoutParams.WRAP_CONTENT,
        LinearLayout.LayoutParams.WRAP_CONTENT);
params.setMargins(50, 50, 0, 0);
txtWord.setLayoutParams(params);
btnNextWord.setLayoutParams(params);

Place the widgets in the linear layout:

layout.addView(txtWord);
layout.addView(btnNextWord);

Add an onClick listener to the button:

 // Add onClick listener to button.
btnNextWord.setOnClickListener(
    new View.OnClickListener( ) {
        @Override
        public void onClick(View view) {
            txtWord.setText(
            words[(wordIndex++ % numWords)]);
        }
    });

Run the app to test it.
Here are the layout and Java activity files.

Responding to Touch Events

Touch events are used to obtain the locations (x- and y-coordinates) of touches in a view.
The touch events that we will discuss come in three forms:
1. A finger not in contact with a view comes in contact with the view (ACTION_DOWN).
2. A finger in contact with a view moves to a different location on the view without losing contact (ACTION_MOVE).
3. A finger in with a view raises and loses contact with the view (ACTION_UP).
Use the setOnTouchListener to add a touch event handler to a view.
Look at the TouchEvent1 Example.