Here is an instruction how to change desktop background on android device rogramatically by means of WallpaperManager. For simplicity the new wallpaper is taken from project resources.
private void setDesktopWallpaper() { try { WallpaperManager wallpaperManager = WallpaperManager.getInstance(this); wallpaperManager.setResource(R.drawable.my_wallpaper); } catch (IOException e) { SLog.e(TAG, "Error changing wallpaper: " + e.getMessage()); } }
To use another image (for example downloaded from the internet, you can use setBitmap method instead of setResource.
When aplication wants to notify user with sound, the best way to do it is to play notification sound that is set by the user on his device.
To do it, first you need to get Uri to that audio file from RingtoneManager. After that create a Ringtone object from that Uri and play it:
private void playDefaultNotificationSound() { Uri notification = RingtoneManager.getDefaultUri(RingtoneManager.TYPE_NOTIFICATION); Ringtone r = RingtoneManager.getRingtone(getApplicationContext(), notification); r.play(); }
Tutorial will show how to build android widget with one button and image. Button press will change the image displayed. The result will look as follows
What is going to be built
Source code
Hereby I share my widget tutorial source code. Feel free to download.
1. Create widget layout
layout is defined as any other layout in Android app. My layout consists of just one button and one imageView (/res/layout/widget_demo.xml).
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_margin="5sp"
android:background="@android:drawable/alert_dark_frame" >
<ImageView
android:id="@+id/widget_image"
android:layout_width="110sp"
android:layout_height="110sp"
android:layout_gravity="center"
android:src="@drawable/wordpress_icon" />
<Button
android:id="@+id/widget_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Change it!" />
</LinearLayout>
Please remember that views that can be used in widget layout are limited. It depends on android version you are developing for. Find out more here. Make sure that view that you are using is supported by target android SDK version.
2. Create App Widget Provider declaration
This is another xml file that tells android OS that this application has a widget (display your widget in OS widget list). Create it with wizard:
File → New → Android → Android XML File
Widget Provider creation wizard
Widget size should be defined in dp. Usually widget size is related to one icon size on desktop (74 x 74 dp). Size should be mutiplication of such blocks. It may be calculated using formula:
((Number of columns or rows)* 74)
Please remember however to leave some space for margins. My widget has width and height equal to two icon blocks (146 dp x 146 dp):
<?xml version="1.0" encoding="utf-8"?> <appwidget-provider xmlns:android="http://schemas.android.com/apk/res/android" android:initialLayout="@layout/widget_demo" android:minHeight="146dp" android:minWidth="146dp" android:updatePeriodMillis="1000000" > </appwidget-provider>
3. Create AppWidgetProvider onUpdate implementation
Create class extending AppWidgetProvider. It will be responsible for updating your widget while Android OS requests it (e.g. widget is shown to user).
Here you have to set button listener (as a PendingIntent, because RemoteViews supports only that way of communication)
public class MyWidgetProvider extends AppWidgetProvider { @Override public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) { RemoteViews remoteViews = new RemoteViews(context.getPackageName(), R.layout.widget_demo); remoteViews.setOnClickPendingIntent(R.id.widget_button, buildButtonPendingIntent(context)); pushWidgetUpdate(context, remoteViews); } public static PendingIntent buildButtonPendingIntent(Context context) { Intent intent = new Intent(); intent.setAction("pl.looksok.intent.action.CHANGE_PICTURE"); return PendingIntent.getBroadcast(context, 0, intent, PendingIntent.FLAG_UPDATE_CURRENT); } public static void pushWidgetUpdate(Context context, RemoteViews remoteViews) { ComponentName myWidget = new ComponentName(context, MyWidgetProvider.class); AppWidgetManager manager = AppWidgetManager.getInstance(context); manager.updateAppWidget(myWidget, remoteViews); } }
In buildButtonPendingIntent I set that after widget button press the intent will be sent. So now… it is time to catch that intent in Broadcast Receiver and handle widget update
4. Register MyWidgetProvider in AndroidManifest.xml
Add these lines in <application/> tag:
<receiver android:name="MyWidgetProvider" >
<intent-filter >
<action
android:name="android.appwidget.action.APPWIDGET_UPDATE" />
</intent-filter>
<meta-data
android:name="android.appwidget.provider"
android:resource="@xml/demo_widget_provider" />
</receiver>
5. Create Broadcast Intent receiver
This will be called for pending intents updates. Widgets are built on RemoteViews (views that are managed by another process than your application). This is why they communicate with your app by PendingIntents.
public class MyWidgetIntentReceiver extends BroadcastReceiver {
private static int clickCount = 0;
@Override
public void onReceive(Context context, Intent intent) {
if(intent.getAction().equals("pl.looksok.intent.action.CHANGE_PICTURE")){
updateWidgetPictureAndButtonListener(context);
}
}
private void updateWidgetPictureAndButtonListener(Context context) {
RemoteViews remoteViews = new RemoteViews(context.getPackageName(), R.layout.widget_demo);
remoteViews.setImageViewResource(R.id.widget_image, getImageToSet());
//REMEMBER TO ALWAYS REFRESH YOUR BUTTON CLICK LISTENERS!!!
remoteViews.setOnClickPendingIntent(R.id.widget_button, MyWidgetProvider.buildButtonPendingIntent(context));
MyWidgetProvider.pushWidgetUpdate(context.getApplicationContext(), remoteViews);
}
private int getImageToSet() {
clickCount++;
return clickCount % 1 == 0 ? R.drawable.me : R.drawable.wordpress_icon;
}
}
WARNING!!!
Since you are creating RemoteViews from scratch in Broadcast Receiver (using constructor with new keyword), you must refresh widget layout from scratch. Mainly: refresh the button listeners pending intents. This will help you to avoid issues like this and that.
6. Register Broadcast Receiver in AndroidManifest.xml
Add the following lines in <application/> tag:
<receiver
android:name="MyWidgetIntentReceiver"
android:label="widgetBroadcastReceiver" >
<intent-filter>
<action android:name="pl.looksok.intent.action.CHANGE_PICTURE" />
</intent-filter>
<meta-data
android:name="android.appwidget.provider"
android:resource="@xml/demo_widget_provider" />
</receiver>
7. That’s all!
Download the source code and enjoy! Feel free to customize widget according to your needs!
Here you will find some another widget tutorial. Maybe it will also be useful for you.
The goal of this tutorial is to create customized button with your own background. The result will be something like that:
Button in normal state
Button in pressed state
1. Create background graphics files
First you need to create backround image for each button state (normal, pressed, focused etc.). For simplicity it is enough just to provide graphics for pressed and normal state. My files looks like that:
button_left_normal.png
button_left_pressed.png
2. Create scalable 9patches from background files
9 patch is common format that allows button background to scale to fit desired size (width and height). You have to define which fragments should be resized while scaling (middle part of image) and which not (image corners), in order not to change background image shape.
Android SDK provides 9patch tool to create these. It is in your Andrid directory in \Android\android-sdk\tools\draw9patch.exe. Run it and draw line on the left and top edge, then save it to drawables directory (it will have extension like <file_name>.9.png. My files are as follows:
button_left_normal.9.png
button_left_pressed.9.png
Some draw9patch.exe tutrials and instructions are available on the internet. I hope these three will be helpful: Android developers tutorial or YouTube tutorial.
3. Define xml selector
Selector is responsible for reacting on button press changes and showing proper backgrounds to the user. Here you define background files for each state (use 9patch images! These with *.9.png extension!), and put it in your /res/drawable folder. Example:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:state_pressed="true" android:drawable="@drawable/button_left_pressed"/> <item android:state_focused="true" android:drawable="@drawable/button_left_pressed"/> <item android:drawable="@drawable/button_left_normal"/> </selector>
4. Create UI button and define its background
Now all you need to do is to define a button and set its background to selector file defined earlier. In my case this is button_bgnd_left.xml file:
<Button android:id="@+id/calc_addPerson_button" android:layout_width="@dimen/height_button_big" android:layout_height="fill_parent" android:background="@drawable/button_bgnd_left" android:drawableLeft="@drawable/add_person" android:text="@string/calculation_button_addPerson_text" />
This tutorial will show how to prepare ListView with custom items and buttons (with click handlers) like this:
Android ListView with custom items
Source Code
The source code for this tutorial is in this post. You can download it and use as You like.
1. Create single list item layout
Item consists of three views: name, value (EtitTexts) and delete (Button). Its atom_pay_list_item.xml layout is as follows:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" > <EditText android:id="@+id/atomPay_name" android:layout_width="0sp" android:layout_height="fill_parent" android:layout_weight="2" android:gravity="center_vertical" android:hint="@string/EnterPays_atomPay_nameHint" android:textAppearance="?android:attr/textAppearanceSmall" /> <EditText android:id="@+id/atomPay_value" android:layout_width="0sp" android:layout_height="fill_parent" android:layout_weight="1" android:gravity="center" android:inputType="numberDecimal" android:text="@string/EnterPays_TextView_ZeroValue" android:textAppearance="?android:attr/textAppearanceSmall" /> <ImageButton android:id="@+id/atomPay_removePay" android:layout_width="@dimen/width_button" android:layout_height="fill_parent" android:contentDescription="@string/emptyText" android:onClick="removeAtomPayOnClickHandler" android:src="@android:drawable/ic_menu_delete" /> </LinearLayout>
Notice, that the button has onClick handler defined in xml layout file. This is because I want to refer its action to specific list item, so handler will be implemented in Activity file and each button will know to which list item it belongs. Later I will show how to do it in detail.
2. Create list item adapter
This is java class that is a controller for atom_pay_list_item.xml. It keeps references for all of its views and puts these references in tags and extends ArrayAdapter. My adapter looks as follows:
public class AtomPayListAdapter extends ArrayAdapter<AtomPayment> { private List<AtomPayment> items; private int layoutResourceId; private Context context; public AtomPayListAdapter(Context context, int layoutResourceId, List<AtomPayment> items) { super(context, layoutResourceId, items); this.layoutResourceId = layoutResourceId; this.context = context; this.items = items; } @Override public View getView(int position, View convertView, ViewGroup parent) { View row = convertView; AtomPaymentHolder holder = null; LayoutInflater inflater = ((Activity) context).getLayoutInflater(); row = inflater.inflate(layoutResourceId, parent, false); holder = new AtomPaymentHolder(); holder.atomPayment = items.get(position); holder.removePaymentButton = (ImageButton)row.findViewById(R.id.atomPay_removePay); holder.removePaymentButton.setTag(holder.atomPayment); holder.name = (TextView)row.findViewById(R.id.atomPay_name); holder.value = (TextView)row.findViewById(R.id.atomPay_value); row.setTag(holder); setupItem(holder); return row; } private void setupItem(AtomPaymentHolder holder) { holder.name.setText(holder.atomPayment.getName()); holder.value.setText(String.valueOf(holder.atomPayment.getValue())); } public static class AtomPaymentHolder { AtomPayment atomPayment; TextView name; TextView value; ImageButton removePaymentButton; } }
Here I display list of AtomPayment class items. There are three most important elements here:
My AtomPayment.java is quite simple as for now and it looks a bit like BasicNameValuePair:
public class AtomPayment implements Serializable { private String name = ""; private double value = 0; public AtomPayment(String name, double value) { this.setName(name); this.setValue(value); } ... }
Of course there are additionally getters and setters for each private field.
3. add ListView in your activity layout xml file
In the simpliest form, it is enough to add this view to activity layout:
<ListView android:id="@+id/EnterPays_atomPaysList" android:layout_width="fill_parent" android:layout_height="wrap_content"> </ListView>
4. Set up adapter to this list view in Activity Java code
In order to display items in ListView you need to set up its adapter and map it to some other ArrayList of AtomPayment objects (as I am extending an Array adapter here). Here is code that is responsible for binding adapter to editPersonData.getAtomPayments() ArrayList:
AtomPayListAdapter adapter = new AtomPayListAdapter(AddNewPerson.this, R.layout.atom_pay_list_item, editPersonData.getAtomPayments()); ListView atomPaysListView = (ListView)findViewById(R.id.EnterPays_atomPaysList); atomPaysListView.setAdapter(adapter);
5. Adding / removing items to ListView (and its adapter)
Adapter is handled just like any other ArrayList, so adding new element to it is as simple as:
AtomPayment testAtomPayment = new AtomPayment("Test", 13); adapter.add(testAtomPayment); adapter.remove(testAtomPayment);
6. Handle Remove Payment button click event
In an activity’s code, where ListView is displayed, add public method that will handle remove button click action. The method name has to be exactly the same as it was in atom_pay_list_item.xml:
android:onClick="removeAtomPayOnClickHandler"
The method body is as follows:
public void removeAtomPayOnClickHandler(View v) { AtomPayment itemToRemove = (AtomPayment)v.getTag(); adapter.remove(itemToRemove); }
The AtomPayment object was stored in ImageButton’s Tag element. Now it is enough to read it from Tag, and remove this item from the adapter.
7. Incorporate remove confirmation dialog window
Probably you need also make sure that user intentionally pressed the remove button by asking him additional question in confirmation dialog like this one:
Confirmation dialog sample
Please go to my post that contains tutorial how to show and handle confirmation dialog to find out how to do it.
Source Code
The source code for this tutorial is in this post. You can download it and use as You like.
What is it
While programing GUI on Android one should mostly define dimensions in dp (density independent pixels) instead of px (pixels). The main difference between both is:
dp will always have the same size on every smartphone screen. px is not always the same dimensions. It is well visualized on screenshots on Android API Guides, in section Density independence - note images showing results of using x vs. dp on various screens.
px size depends on screen density (or screen resolution). Density (dpi) defines how many pixels will fit in one inch on the screen. Higher density means that there will be more pixels on one inch than on the screen with lower density.
How to use it
Relation of dp, px and dpi is:
px = dp * (dpi / 160)
That means that the definition is as follows: One pixel is equal to one dp on 160 dpi screen.
Each device screen has its dpi value. For example HTC Desire HD dpi value is 255 dpi. For example, for HTC Desire HD screen, values’ relations between dp and px is presented in table below. These are font sizes fo TextView.
| px value | dp value | what is it? |
| 28,7 | 18 | large font size |
| 25,5 | 16 | medium font size |
| 22,3 | 14 | small font size |
| 19,1 | 12 | micro font size |
What is it useful for
This is necessary while developing GUI, and while designing it in some vector graphic tools (Adobe Illustrator, Inkscape), where only pixels can be used.
It is possible to develop one application that will run on several mobile platforms (like Android, iOS, Windows Phone, Symbian etc.). Such cross-platform frameworks are mased mainly on HTML5 and gives access to native phone sensors and devices such as for example accelerometer, camera, gps or contact book.
Here are popular platforms for mobile cross-platform programming:
