Ejercicio3 Android

8/12/2019 Ejercicio3 Android

1/29

2Presenting Data for Views

Activity

Most Android data-centric classes are built on top ofAdapterobjects, and thus extend the

AdapterViewclass. AnAdapter , Adapterobject is used to create Viewobjects for data

Viewfor each of the data

robust of structures).

The most commonAdapterViewclasses you'll encounter are: ListView, Spinner, and

GridView ListViewclass and GridView, and explore


2/29

[38 ]

Listing and selecting data

TheListView

by a ListAdapter

data objects in a View. A ListView

in a ScrollView.

ListView choice modesThe ListView

constants: CHOICE_MODE_NONE, CHOICE_MODE_SINGLE, and CHOICE_MODE_MULTIPLE.

The mode for a ListViewcan be set by using the android:choiceMode

ListView.setChoiceModemethod in Java.

The choice mode of a ListView ListView ListView ListAdapter Viewobjectsfor each of the items that should appear in the ListView.

No selection mode CHOICE_MODE_NONE

ListView. The reason is it makes

ListView

ListViewis to

ListViewobject displaying a list of

Stringarray Java object, taken from one of the defaultApiDemos


3/29

Chapter 2

[39 ]

Single selection mode CHOICE_MODE_SINGLE

In this mode, the ListViewacts more like a desktop List

Activity. It's quite common for a

ListView

ListAdapterobject.

In the android R ListView

list.setAdapter(new ArrayAdapter(

this,

android.R.layout.simple_list_item_single_choice,

getResources().getStringArray(R.array.colors)));

ArrayAdapterclass from the android.widgetpackage.

simple_list_

item_single_choice

display items in a ListView CHOICE_MODE_SINGLE. Most typically t

a RadioButtonfor each object in the ListAdapter.


4/29

[40 ]

Multiple selection mode CHOICE_MODE_MULTIPLE

In ListView

ListAdapter, Android provides you

android.R.layout.simple_list_item_multiple_choiceresource

CheckBoxfor each object in the ListAdapter.

Adding header and footer widgetsHeaders and footers in a ListView

List

ListAdapter

be able to select them as though they are data elements in the Liststructure. A very simple

example of a header item could be:

TextView header = new TextView(this);

header.setText("Header View");

list.addHeaderView(header);

ListView, but instead a ListView

this case you need to tell the ListView

addHeaderViewor

addFooterView:

TextView footer = new TextView(this);

footer.setText("Footer View");

list.addFooterView(footer, null, false);

The ListView

that you can also provide an Object AdapterView.

getItemAtPosition(index) null.

ListView). The third parameter tells the ListView


5/29

Chapter 2

[41 ]

ListView

ListViewobject.

Creating a simple ListViewTo introduce the ListView

Activity

simple ListViewpopulated from a resource.

Time for action creating a fast food menu

To

1. androidproject using the Android command-line tool:

android create project -n DeliveryDroid -p DeliveryDroid -k com.packtpub.deliverydroid -a SelectRestaurantActivity -t 3

2. Open the /res/values/strings.xml

3.

order from:

The Burger PlaceMick's Pizza

Four Buckets \'o FruitSam\'s Sushi

4. Open the /res/layout/main.xml

5. LinearLayout.

6. element.

7. Assign the element an ID of restaurant:

8. ListViewto fill_parent:

android:layout_width="fill_parent"android:layout_height="fill_parent"


6/29

[42 ]

9.

ListView

android:entries="@array/restaurants"

10. main.xml

What just happenedIf

choiceModeon the ListView CHOICE_MODE_NONE, making this

to its menu.

android:entries

AdapterViewrequires you to create anAdapterobject to create Viewobjects for each ofthe data objects.


7/29

Chapter 2

[43 ]

Using the android:entries

ListView

AdapterView

The Viewobjects created by the generated ListAdapter

ListView. Since

You Whereshouldweorder

from? Activity

AndroidManifest.xml

Styling the standard ListAdaptersThe standard ListAdapter

TextView

CheckedTextView TextView

ListAdapter

Since a ListView CHOICE_MODE_NONE change the items into Buttonobjects instead of normal TextView

ListView TextView

ToggleButtonView

In t

res/

values/dimens.xml


8/29

[44 ]

48sp 52sp

45sp

24sp

15dp

We d item_outer_heightand item_

inner_height. The item_outer_height

item_inner_heightis the height of any Viewobject contained inside the list item.

The padding

dp

the user).

In t item_outer_heightand menu_item_heightare 48spand 52sp ListViewrather 48sp. The height of a list

target list item if you make them too small.

needs to touch it, make it big.

Time for action improving the restaurant listThe

ListView

standard ListAdapter ListAdapterobject

in your Java code.

1. res/layoutdirectory named menu_item.xml.

2. Create the root XML element as a TextView:

3. Import the Android resource XML namespace:

xmlns:android="http://schemas.android.com/apk/res/android"


9/29

Chapter 2

[45 ]

4. Center the text in the TextView

android:gravity="center|center_vertical"

5. We assign the textSizeof the TextViewto our standard item_text_size:

android:textSize="@dimen/item_text_size"

6. The default color of the text of TextView

android:textColor="#ffffff"

7. TextViewto be the same as the ListViewthat contains

it. Since this is for our main menu, its height is menu_item_height:

android:layout_width="fill_parent"android:layout_height="@dimen/menu_item_height"

8. TextView menu. Open the SelectRestaurantActivity.java

9. In the onCreate setContentView

the ListView main.xml:

ListView restaurants = (ListView)findViewById(R.id.restaurant);

10. Set the restaurants ListAdapter ArrayAdaptercontaining the string-

values.xml

restaurants.setAdapter(new ArrayAdapter(this,R.layout.menu_item,

getResources().getStringArray(R.array.restaurants)));

What just happened TextView

to be used for each list item in our restaurant's ListView. The menu_item.xml


10/29

[46 ]

Unlike our previous layout resources, menu_item.xmlcontained no ViewGroup

LinearLayout). This is due to the fact that theArrayAdapter

root Viewof the menu_item.xml TextView TextViewin a

ViewGroup ClassCastException.

We also created anArrayAdapterinstance to reference both our menu_itemXML

the use of the android:entries ListViewin the main.xmllayout

onCreatemethod in

SelectRestaurantActivity

public void onCreate(final Bundle icicle) { super.onCreate(icicle); setContentView(R.layout.main);

final ListView restaurants = (ListView) findViewById(R.id.restaurant);

restaurants.setAdapter(new ArrayAdapter( this, R.layout.menu_item, getResources().getStringArray(R.array.restaurants))); }

Try

greeted by a screen that looks a lot more like a menu:

Have a go hero developing a multiple-choice question application

Try g Chapter1, Developinga

Simple. It uses LinearLayoutand Button

Use a ListViewinstead of a LinearLayout

Style the ListView Button

TextViewobjects


11/29

Chapter 2

[47 ]

Buttonlist items so that they're not

too close to each other

Creating custom adapters

ListView ListAdapter

us to select a Cheeseitem, but not for us to request Cheese. In order to

ListAdapter

Creating a menu for The Burger Place

Activityclass. In

ThePlace

quick glance).

The Burger class

Burgerdata object. The Burgerclass

Burgerthe user

is ordering. Create a Burger.java

class Burger {

final String name;

int count = 0;

public Burger(String name) {

this.name = name;

}

}

nameand count


12/29

[48 ]

Time for action creating a Burger item layout

ThePlaceis to design

ListAdapterourselves

TextView, but can instead build a more

complex layout.

1. res/layoutdirectory named burger_item.xml.

ListView.

2. Declare the root of the layout as a horizontalLinearLayout

ListView):

3. Next, declare a TextView counterfor the number of

4. The counter

bold

android:textSize="@dimen/item_text_size"android:textStyle="bold"

5. counter

the same:

android:layout_width="@dimen/item_inner_height"android:layout_height="@dimen/item_inner_height"

6. counter:

android:gravity="center|center_vertical"

7. We'll also need a text space to display the name of the burger:

8.

android:textSize="@dimen/item_text_size"


13/29

Chapter 2

[49 ]

9. counterand the textlabel:

android:layout_marginLeft="@dimen/padding"

10. ListView TextView

objects to be the same:

android:layout_width="fill_parent"android:layout_height="@dimen/item_inner_height"

11.

counter

android:gravity="left|center_vertical"

What just happened?

You've just built a very nice LinearLayoutViewGroup ThePlace. Since the counterTextViewis a separate

object from the label, it can be independently styled and managed. This makes things much

Your complete burger_item.xml


14/29


15/29


16/29

[52 ]

The getViewGroup burger_item.xml

We do this using a LayoutInflator Activity.

setContentView(int)method loads XML layout resources. The Context

parentViewGroup ListView

Burger

the counter TextViewusing the View.setVisibility

setVisiblemethod takes a Boolean setVisibility

takes an intvalue. The reason for this is that Android treats visibility as part of the layout

counter

text

counter.setVisibility(burger.count == 0

? View.GONE

: View.VISIBLE);

ListView

ListView. When an item is highlighted, its background generally

ListView

Buttonor EditText ListView

ListViewfrom registering OnItemClick

events completely.

If you override the isEnabled(intindex)method of ListAdapter, ListView. A commonuse of this is to turn certain items into logical separators. For example, a

Creating TheBurgerPlaceActivity classIn order to put the Burger

Activity

OnItemClickListenerinterface. When a

ListView), objects

occurred. Android provides a simple ListActivityclass to provide some default layout


17/29

Chapter 2

[53 ]

Time for action implementing TheBurgerPlaceActivity

In order to present a ListViewof Burger BurgerAdapter need to create anActivity ThePlace Activity

ListView.

ListViewto

Burger.

1.

TheBurgerPlaceActivity, and make sure it extends ListActivity:

public class TheBurgerPlaceActivity extends ListActivity {

2. Override theActivity.onCreatemethod.

3. Invoke the super.onCreate

4. Create an instance of BurgerAdapter Burgerobjects, and set it as the

ListAdapterfor the ListActivitycode to use:

setListAdapter(new BurgerAdapter(new Burger("Plain old Burger"),new Burger("Cheese Burger"),new Burger("Chicken Burger"),new Burger("Breakfast Burger"),new Burger("Hawaiian Burger"),new Burger("Fish Burger"),new Burger("Vegatarian Burger"),new Burger("Lamb Burger"),new Burger("Rare Tuna Steak Burger")));

5. Finally, implement the onListItemClicked

protected void onListItemClick(ListView parent,View item,int index,long id) {

BurgerAdapter burgers = (BurgerAdapter)

parent.getAdapter();

Burger burger = (Burger)burgers.getItem(index);burger.count++;burgers.notifyDataSetInvalidated();

}


18/29

[54 ]

What just happened? TheBurgerPlaceActivityhas a simple hard-coded list of Burger

objects to display to the user and creates a BurgerAdapterto turn these objects into theburger_itemView

countof the related Burgerobject

in the onItemClickmethod. We then call notifyDataSetInvalidated()on the

BurgerAdapter ListViewthat the underlying data has

changed. When the data changes, the ListView Adapter.getView

method for each item in the ListView.

The items in a ListView Viewobjects. This means

that theAdapter View

View

update it directly.

Registering and starting TheBurgerPlaceActivity Activity

register it in theAndroidManifest.xml AndroidManifest.xml

code into the

...block:

To start theActivity, you'll need to go back to SelectRestaurantActivity

and implement the OnItemClickListener

Adapteron the restaurantsListView, set SelectRestaurantActivity

as the OnItemClickListenerof the restaurantsListView. You can start

TheBurgerPlaceActivityusing an Intentobject in the onItemClickmethod. Your

SelectRestaurantActivity

public class SelectRestaurantActivity extends Activity

implements OnItemClickListener {

@Override public void onCreate(Bundle icicle) {

super.onCreate(icicle);

setContentView(R.layout.main);


19/29

Chapter 2

[55 ]

ListView restaurants = (ListView)

findViewById(R.id.restaurant);

restaurants.setAdapter(new ArrayAdapter(

this,

R.layout.menu_item,

getResources().getStringArray(R.array.restaurants)));

restaurants.setOnItemClickListener(this);

}

public void onItemClick(

AdapterView parent, View item,

int index,

long id) {

switch(index) {

case 0:

startActivity(new Intent( this,

TheBurgerPlaceActivity.class));

break;

} }

}

to


20/29

[56 ]

Pop quiz

ListViewobject to CHOICE_MODE_SINGLEa. Add a RadioButtonto each item.

c. Make the ListView

2. A ListAdapter ListView

to reuse a View

a. When the data model is invalidated or changed.

b. On every item, for rubber-stamping.

c. When the ListView

3. When a ListView

The ListViewclass is great for displaying small to medium amounts of data, but there

I

ExpandableListViewfor this type of grouping. Each item is nested inside a group, and a

ExpandableListView to keep the amount of data to a reasonable length. In these cases, consider

More ListViewfor the groups, and aseparateActivityfor the nested items.


21/29

Chapter 2

[57 ]

Since the ExpandableList

a normal ListAdapter ExpandableListAdapter

ExpandableListAdapter,

it's generally easiest to have your ExpandableListAdapter

the BaseExpandableListAdapter

and triggering.

The ExpandableListAdapter

Viewobject as

returned by the ExpandableListAdapter. To stop your group label from being

View

structures. The default padding for a list item is available as the theme parameterexpandableListPreferredItemPaddingLeft

android:paddingLeft="?android:attr/expandableListPreferredItemPaddingLeft"

In order to keep your ExpandableListViewlooking consistent, it's a good idea to add the

ExpandableListView

Have a go hero - ordering customized pizzas

For the Mick'sPizza

TextView

TextView TextView

toppings are not included, On Extrafor toppings that the

ToppingCatagoryobjects, containing a name and an array of

PizzaTopping

PizzaToppingAdapterclass, extending the

BaseExpandableListAdapterclass. Make use of the default Android simple_

expandable_list_item_1 layout resource for the item labels.


22/29

[58 ]

,

On, and .

Using the ListView.getAdapter() ExpandableListAdapter To fetch the original ExpandableListAdapter the getExpandableListAdapter() make use of the ExpandableListView.OnChildClickListenerinterface to receive click events.

Activity

Using the GridView class

A GridViewis a ListView

GridView. The GridViewclass makes use of a ListAdapterin the exact same format

as ListView GridView

for lists of icons.

A GridView than a ListView


23/29


24/29

[60 ]

What just happened?The fruit_item.xml

many other types of icons represented as a grid. ImageView LinearLayouthas the

fill_parent. When placed in a GridViewas a single item,

using fill_parent LinearLayout

GridView).

Displaying icons in a GridViewWe need an object model and ListAdapterin order to display the fruits to the user in a

GridView ListAdapter

a FruitItem

class FruitItem {

final String name;

final int image;

FruitItem(String name, int image) {

this.name = name;

this.image = image;

}

}

Bitmapobject

in each FruitItem

FruitItem

to put them in the res/drawabledirectory.


25/29

Chapter 2

[61 ]

Time for action building the fruit menu

For the ListAdapter render the FruitItemobjects into the fruit_item.xmllayout resources. We'll also need

a layout resource for the GridView Activityclass.

1. FruitAdapterextending BaseAdapterin the root

package of the project.

2. FruitAdapterneeds to hold and represent an array of FruitItem

objects. Implement the class using the same structure as the BurgerAdapter.

3. In the ListAdapter.getView

fruit_item.xmllayout resource:

FruitItem item = items[index];

TextView text = ((TextView)view.findViewById(R.id.text));ImageView image = ((ImageView)view.findViewById(R.id.icon));text.setText(item.name);image.setImageResource(item.image);

4. GridView

menu, and name it res/layout/four_buckets.xml.

5. GridView:

What just happened? four_buckets.xmllayout resource has nothing but a GridView. This is unlike

GridViewhas no ID.

For this example, the fruit menuActivity GridView, so

5dip. A GridView


26/29

[62 ]

Time for action creating the FourBucketsActivity

S GridView, and no ID reference, Activitystep-by-step. Unlike previous

Activity GridView

four_buckets.xml, and this means loading it manually.

1.

public class FourBucketsActivity extends Activity {

2. Override the onCreate

protected void onCreate(final Bundle istate) {super.onCreate(istate);

3. Get the LayoutInflatorinstance for yourActivityobject:

LayoutInflater inflater = getLayoutInflater();

4. four_buckets.xmlresource and cast its contents directly to a

GridViewobject:

GridView view = (GridView)inflater.inflate(R.layout.four_buckets,null);

5. Set the ListAdapterof the view FruitAdapter

FruitAdapter FruitItemobjects:

view.setAdapter(new FruitAdapter(new FruitItem("Apple", R.drawable.apple),

new FruitItem("Banana", R.drawable.banana),new FruitItem("Black Berries", R.drawable.blackberry),// and so on

6. Use setContentViewto make the GridViewyour root Viewobject:

setContentView(view);

7. Register your FourBucketsActivityclass in yourAndroidManifest.xml.

8. Add a case to the SelectRestaurantActivity

FourBucketsActivity

What just happened?You just completed the


27/29

Chapter 2

[63 ]

If you look through theActivity

setContentViewmethod, there's no correspondinggetContentViewmethod. Take a

addContentViewmethod. AnActivityobject may

have any number of View

getContentViewmethod.

I

getLayoutInflator()method used is simply a shortcut for LayoutInflator.

from(this). Instead of using an ID and findViewById Viewreturned

directly to a GridView, since that's all that our four_buckets.xml

ArrayAdapter TextView

AdapterView, in

ListView

FourBucketsActivity

Have a go hero Sam's Sushi

The last restaurant on the menu is Sam'sSushi. Try using the Spinner

a GridViewto create a composite sushi menu. Place the spinner at the top of the screen,

Sashimi

Maki Roll Nigiri

Oshi


28/29

[64 ]

California Roll

Hand Roll

Spinner, use a GridView

Tuna

Snapper

Salmon

Eel

Sea Urchin

Squid

Shrimp

The Spinnerclass makes use of the SpinnerAdapterinstead of a ListAdapter.

The SpinnerAdapter View

android.R.layout.simple_

dropdown_item_1line

make use of the android:entries SpinnerXML element.

Summary

ListViewis probably one of the most commonly

The GridView ListView

in a GridView

for other items to be displayed.


29/29

Chapter 2

[65 ]

Building customAdapter

styling of the ListView

Adapter View

data. Take a good look at the defaultAdapter

Viewclasses

Ejercicio3 Android

Documents