Parse and Android: my slide for DroidconIT 2015

Yesterday, I had a talk about Android and Parse, in Turin.

The talk was inside a barcamp session.

The slide are here:

More articles on parse.com and android will be available on the blog in the next months :)

Number / Money Picker Dialog in Android

I needed to create a money picker dialog for one of my apps called Qoffee.
This money picker is used to signal the price of a coffee in a bar.
Here is the dialog:

To build this dialog I created an AlertDialog with a Custom Layout.
First of all you need to define the layout with a classic xml layout file:


< LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"  >
    < TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:padding="10dp"
        android:textSize="16sp"
        android:text="@string/bar_change_price"/>

    < LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center">
       
    < NumberPicker
        android:id="@+id/euro_picker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />
   
     < TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:padding="5dp"
        android:textSize="20sp"
        android:text="@string/point_symbol"/>
   
    < NumberPicker
        android:id="@+id/cent_picker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />
     < TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:padding="5dp"
        android:textSize="20sp"
        android:text="@string/euro_symbol"/>
   
    </ LinearLayout>
</ LinearLayout>

In my case this is made by:

• 1 textview for main dialog description
• 2 number pickers: 1 for euro and 1 for cents
• other descriptive textview: for euro and point symbols

If you pay attention, you see I didn't defined any buttons.
The bottom buttons are defined as part of the AlertDialog: you don't have to define it in the layout.

The code to show this dialog follows:

AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
LayoutInflater inflater = getActivity().getLayoutInflater();
View theView = inflater.inflate(R.layout.number_picker_dialog, null);
//I define the dialog and I load the xml layout: number_picker_dialog.xml into the view

final NumberPicker unit_euro = (NumberPicker) theView.findViewById(R.id.euro_picker);
final NumberPicker cent = (NumberPicker) theView.findViewById(R.id.cent_picker);
// I keep a reference to the 2 picker, in order to read their properties for later use
                  
builder.setView(theView)
.setPositiveButton(R.string.accept_price_change,new DialogInterface.OnClickListener() {
    @Override
    public void onClick(DialogInterface dialog, int which) {
            Log.d("DBG","Price is: "+unit_euro.getValue() + "."+cent.getValue());
    }
}).setNegativeButton(R.string.reject_price_change, new DialogInterface.OnClickListener() {
    @Override
    public void onClick(DialogInterface dialog, int which) {
                      
    }
});
// I define 2 default buttons, with 2 strings (accept_price_change and reject_price_change) and their behaviours

unit_euro.setMinValue(0);
unit_euro.setMaxValue(3);
// I define the range for the first numberpicker.

String cents[] = new String[20];
for(int i = 0;i < 100; i+=5) {
    if( i < 10 )
       cents[i/5] = "0"+i;
    else
        cents[i/5] = ""+i;
}
cent.setDisplayedValues(cents);
//I create the range of the possible values displayed in the second numberpicker.

cent.setMinValue(0);
cent.setMaxValue(19);
cent.setValue(0);              
//I configure the possible values of the second picker

builder.show();
//Finally, the alert is showed!