Udacity: Android Basics

User Interface¶

Images & Texts¶

• wrap content: android:layout_height="wrap_content"
• dp: density-independent pixel
• text size: android:textsize="20sp"
• sp: scalar-independent pixel
• background and text color: android:background="#66ffcc" android:textColor="66ccff"

View Groups¶

Linear Layout¶

• linear layout: similar to Hbox and Vbox in javaFX, one linear layout can contain many other linear layouts
• weight values: give different weights to layouts to determine what proportion of the space they should take in the screen

Relative Layout¶

• relative layout to parent:android:layout_align_Parent(Top/Bottom/Left/Right) = "true/false"; android:layout_center(Horizontal/Vertical)="true"

• assigning ID: android:id = "@+id/ben_textview" (used “+” because we added a new ID to the library)

• referring to ID: android:id = "@id/ben_textview" (no longer need the “+” here)

• relative layout to others: android:layout_to(Right/Left)Of="@id/pic"

Multiscreen Apps¶

Add texts to the Layout¶

with List¶

ArrayList<String> words;

//findViewById only returns a View, we should downcast it to a LinearLayout
LinearLayout rootView = (LinearLayout) findViewById(R.id.rootView);

for(String word:words){
    //TextView takes into a context, in this case is "this"
    TextView wordView = new TextView(this);
    wordView.setText(word);
    
    //add wordView to the this View of List(LinearLayout)
    rootView.addView(wordView);
}

However, a LinearLayout is not scrollable and can easily go beyond the screen. Therefore, we should use an ArrayAdapter

with ArrayAdapter¶

ArrayAdapter<Word> itemsAdapter = new WordAdapter(this, words);
ListView listView = (ListView) findViewById(R.id.list);
listView.setAdapter(itemsAdapter);

We have to create two more classes: a Word class, and a customized WordAdapter that extends ArrayAdapter<Word>. We also have to create another XML file to customize the display of one item in the list.