AppWidget实现自定义view

一、鸡汤

appwidget是Android中小组件,我们经常说的widget其实是指的那些button、textview、imageview等这些小控件,而appwidget则是嵌入到别的app中的activity中显示的一种视图。通常我们的appwidget都是嵌入到luncher应用中的(我们经常说的桌面其实也是一款app也就是home luncher应用,手机里的应用会在其activity内显示一个启动图标),运行在luncher应用中,而其事件处理都是在本app内的进程中完成的,所以这里就会涉及到跨进程通信,而如果本应用想要跟appwidget的视图所运行的app通信,因为appwidget运行在别的进程中,只能使用remoteview去更新视图,remoteview相比于view具有跨进程的能力但是其支持的视图也是非常有线的,常用的大概就是textview、imageview、imagebutton、button、listview、gridview,其余的像自定义view、recycleview等等都是不支持的,所以appwidget的功能还是非常有限的。如果我们只是使用像textview这种没有子布局的控件那么使用方式是非常简单的,这里会涉及到:AppWidgetProvider、AppWidgetProviderInfo这两个类。而如果涉及到像listview、gridview这种,还会涉及到RemoteViewsService和RemoteViewsFactory。


AppWidgetProvider:该类继承自broadcastreceiver,需要在清单文件中注册标签。

AppWidgetProviderInfo:该类只需写xml文件就可以了,xml放在res/xml下面,跟标签为.

RemoteViewsService:该类继承自service,需要在清单文件中注册。

RemoteViewsFactory:该类为RemoteViewsService的内部类,处理service中的工作。


ok,有了上面的大体介绍,下面我们就这两种情况具体来介绍一下。


只含有textview、button等情况

首先我们要准备一个appwidget用来显示的布局文件,这里我们假定只有一个button,放在layout下面就ok,取名为widget_layout,具体代码就补贴出来了,你自己决定写什么样的效果,不过只能含有我上面说的哪几种情况哦。接下来我们需要准备一个AppWidgetProviderInfo类,上面知道这个类是在res/xml下面新建一个xml文件来自动生成的,具体代码如下类似:

[java] view plain copy print ?
  1. "1.0" encoding="utf-8"?>  
  2. "http://schemas.android.com/apk/res/android"  
  3.     android:initialLayout="@layout/widget_layout"  
  4.     android:minHeight="300dp"  
  5.     android:minResizeHeight="90dp"  
  6.     android:minResizeWidth="190dp"  
  7.     android:resizeMode="horizontal|vertical"  
  8.     android:minWidth="200dp">  
  9.   
  10.       
简要的介绍下属性值:
initialLayout:指定把appwidget放置在桌面上的时候的初始布局。

minHeight、minResizeHeight:前一个是指定appwidget的最小高度,后一个指定在允许重新测量appwidget高度的情况下的最少高度,后一个值必须要小于前一个值,否则其会被忽略。

resizeMode:允许在哪些方向上重新测量,我们都知道appwidget在桌面显示的时候会有横向和纵向上有多少个格子,比如2*2、4*4,系统就是根据其能提供的类型和minHeight的值算出一个新的ResizeHeight,如果这个值小于miniResizeHeight就会自动在对应方向上增加一个格子的大小。

其还有下面的属性:

android:configure:指定appwidget第一次放置在桌面上面的时候需要打开的activity,如果配置了这个属性下面将讲到的AppwidgetProvider中的onUpdate就不会在第一次被调用,以后的添加才执行改调用。

android:previewImage:指定appwidget在预览界面显示的图片,也就是我们选择appwidget的时候显示的界面,如果不设置改属性系统就会给app的icon图标作为预览。

 android:widgetCategory="home_screen|searchbox|keyguard":用来设置appwidget可以在那些情况下显示,默认只能在home——screen上面显示。keyguard用来在锁屏的时候显示,searchbox实在搜索页面添加。

 android:updatePeriodMillis:自动更新的时间,最少为半个小时。

ok,配置好上面的类之后我们来看看AppWidgetProvieder这个类,前面说了该类是继承自BroadcastReceiver,所以我们要在清单文件中配置标签,如下所示:

[java] view plain copy print ?
  1. ".WidgetProviderClass">  
  2.             
  3.               "android.appwidget.action.APPWIDGET_UPDATE">  
  4.               "com.xinxue.action.TYPE_BTN">  
  5.               "com.xinxue.action.TYPE_LIST">  
  6.             
  7.           
  8.               android:name="android.appwidget.provider"  
  9.               android:resource="@xml/widget_provider">  
  10.         

这里的是必须要写的,名字是固定的,resource就是我们创建的上面的那个xml文件的位置。其中
[java] view plain copy print ?
  1. "android.appwidget.action.APPWIDGET_UPDATE">  

这个是必须要写的一个action,用来接收appwidget更新的广播,后两个为我自己写的广播。下面我们来看看AppwidgetProvider中的代码:

[java] view plain copy print ?
  1. public class WidgetProviderClass extends AppWidgetProvider {  
  2.    
  3. }  

其实我们只要继承它就可以了,里面的代码我们可以都不写,这样运行就会正常的使用appwidget了。前提是我们的widget的视图必须是没有包含子视图的布局,比如只有一个textview,去你的appwidget里面选择我们的小组件放在桌面,这里我贴一下运行的效果:

AppWidget实现自定义view_第1张图片


也许你的效果和我的不一样,那取决于你定义的appwidget的布局文件的效果。ok,简单的效果是有了,如果你想要给按钮添加上点击事件,我们只需要在appwidgetprovider的类中重写onUpdate方法,如下类似:

[java] view plain copy print ?
  1. public class WidgetProviderClass extends AppWidgetProvider {  
  2.     public static final String BTNACTION = "com.xinxue.action.TYPE_BTN";  
  3.   
  4.     @Override  
  5.     public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {  
  6.         super.onUpdate(context, appWidgetManager, appWidgetIds);  
  7.         RemoteViews remoteViews = new RemoteViews(context.getPackageName(), R.layout.widget_layout);  
  8.         //创建一个广播,点击按钮发送该广播  
  9.         Intent intent = new Intent(BTNACTION);  
  10.         PendingIntent pendingIntent = PendingIntent.getBroadcast(context, 1, intent, PendingIntent.FLAG_UPDATE_CURRENT);  
  11.         remoteViews.setOnClickPendingIntent(R.id.widget_btn, pendingIntent);  
  12.         //如果你添加了多个实例的情况下需要下面的处理  
  13.         for (int i = 0; i < appWidgetIds.length; i++) {  
  14.             appWidgetManager.updateAppWidget(appWidgetIds[i], remoteViews);  
  15.         }  
  16.     }  
  17.   
  18.     @Override  
  19.     public void onReceive(Context context, Intent intent) {  
  20.         switch (intent.getAction()) {  
  21.             case BTNACTION:  
  22.                 Toast.makeText(context, "点到我啦!", Toast.LENGTH_SHORT).show();  
  23.                 break;  
  24.   
  25.   
  26.         }  
  27.         super.onReceive(context, intent);  
  28.     }  
  29. }  
运行之后点击你的按钮就可以看到效果啦。我简单的给你介绍下上面的代码,在onUpdate方法中首先创建一个remoteview实例,再创建一个带有指定action的Intent,然后通过这个intent创建一个能发送广播的pendingIntent,然后调用remoteview的setOnClickPendingIntent方法绑定一个点击事件,点击按钮的时候会发送带有前面action的广播,要主要的是该方法的第一个参数为要点击的view的id。因为前面我们在清单文件中已经注册过这种类型的广播,在这里就可以收到该广播了,我们只需要重写其onReceiver方法,在里面过滤出我们需要的广播,在这里你就可以实现自己的点击逻辑了,比如打开app的首页。


带有listview的情况


我们修改自己的布局文件,添加一个listview,如下所示:

[java] view plain copy print ?
  1. "1.0" encoding="utf-8"?>  
  2. "http://schemas.android.com/apk/res/android"  
  3.     android:id="@+id/kk"  
  4.     android:layout_width="match_parent"  
  5.     android:layout_height="match_parent"  
  6.     android:orientation="vertical">  
  7.   
  8.  
  9.    android:id="@+id/widget_listview"  
  10.      android:background="#000"  
  11.      android:layout_width="match_parent"  
  12.      android:layout_height="match_parent">  
  13.   
  14.    
  15.   
  16.   

OK,前面我们说到,要使用这种带有子布局的情况需要使用remoteviewsService和RemoteViewsFactory,那么我们新建一个类叫RemoteviewsServiceImp,让它继承与RemoteviewsService,然后实现里面的方法,不要忘记在manifest文件里面添加标签,标签内的内容如下:

[java] view plain copy print ?
  1.            android:name=".RemoteViewServiceImp"  
  2.            android:permission="android.permission.BIND_REMOTEVIEWS">  

**********注意权限哦!

因为remoteviewsservice的任务都是交给factory去完成的,这里我们就建立一个内部类让它实现remoteviewsfactory接口,然后重写里面的方法,完成后的代码如下:

[java] view plain copy print ?
  1. package com.example.leixinxue.widgettest;  
  2.   
  3. import android.content.Context;  
  4. import android.content.Intent;  
  5. import android.widget.RemoteViews;  
  6. import android.widget.RemoteViewsService;  
  7.   
  8. import java.util.ArrayList;  
  9.   
  10. /** 
  11.  * Created by leixinxue on 16-8-8. 
  12.  */  
  13.   
  14. public class RemoteViewServiceImp extends RemoteViewsService {  
  15.   
  16.     @Override  
  17.     public RemoteViewsFactory onGetViewFactory(Intent intent) {  
  18.         return new RemoteviewFactoryImp();  
  19.     }  
  20.   
  21.     class RemoteviewFactoryImp implements RemoteViewsFactory {  
  22.         @Override  
  23.         public void onCreate() {  
  24.   
  25.         }  
  26.   
  27.         @Override  
  28.         public void onDataSetChanged() {  
  29.   
  30.         }  
  31.   
  32.         @Override  
  33.         public void onDestroy() {  
  34.   
  35.         }  
  36.   
  37.         @Override  
  38.         public int getCount() {  
  39.             return 0;  
  40.         }  
  41.   
  42.         @Override  
  43.         public RemoteViews getViewAt(int position) {  
  44.             return null;  
  45.         }  
  46.   
  47.         @Override  
  48.         public RemoteViews getLoadingView() {  
  49.             return null;  
  50.         }  
  51.   
  52.         @Override  
  53.         public int getViewTypeCount() {  
  54.             return 0;  
  55.         }  
  56.   
  57.         @Override  
  58.         public long getItemId(int position) {  
  59.             return 0;  
  60.         }  
  61.   
  62.         @Override  
  63.         public boolean hasStableIds() {  
  64.             return false;  
  65.         }  
  66.     }  
  67. }  

OK,下面我们就来写里面具体的代码。首先是让listview传到remoteviewsservice这里来,然后通过它传给remoteviewsfactory,在factory里面就是填充listview的布局内容,我们现在建立一个listview的item的布局文件,里面的代码如下:

[java] view plain copy print ?
  1. "1.0" encoding="utf-8"?>  
  2. "http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical">  
  6.   
  7.     
  8.         android:id="@+id/item_textView"  
  9.         android:layout_width="match_parent"  
  10.         android:layout_height="wrap_content"  
  11.         android:layout_gravity="center"  
  12.         android:layout_marginBottom="5dp"  
  13.         android:layout_marginLeft="10dp"  
  14.         android:layout_marginTop="5dp"  
  15.         android:text="TextView"  
  16.         android:textColor="#fff"  
  17.         android:textSize="18sp" />  
  18.   

下面我们来到APPwidgetprovider里面的onupdate方法里面修改代码,修改后的代码如下:

[java] view plain copy print ?
  1.  @Override  
  2.     public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {  
  3.         super.onUpdate(context, appWidgetManager, appWidgetIds);  
  4.         RemoteViews remoteViews = new RemoteViews(context.getPackageName(), R.layout.widget_layout);  
  5.   
  6. //绑定service用来填充listview中的视图  
  7.         Intent intent = new Intent(context, RemoteViewServiceImp.class);  
  8.         remoteViews.setRemoteAdapter(R.id.widget_listview, intent);  
  9.   
  10.   
  11.         //如果你添加了多个实例的情况下需要下面的处理  
  12.         for (int i = 0; i < appWidgetIds.length; i++) {  
  13.             appWidgetManager.updateAppWidget(appWidgetIds[i], remoteViews);  
  14.         }  
  15.     }  

我们来到factory里面绑定listview的视图,完成后的代码如下:

[java] view plain copy print ?
  1. package com.example.leixinxue.widgettest;  
  2.   
  3. import android.content.Context;  
  4. import android.content.Intent;  
  5. import android.widget.RemoteViews;  
  6. import android.widget.RemoteViewsService;  
  7.   
  8. import java.util.ArrayList;  
  9.   
  10. /** 
  11.  * Created by leixinxue on 16-8-8. 
  12.  */  
  13.   
  14. public class RemoteViewServiceImp extends RemoteViewsService {  
  15.     @Override  
  16.     public RemoteViewsFactory onGetViewFactory(Intent intent) {  
  17.         return new RemoteViewsFactoryImp(this, intent);  
  18.     }  
  19.   
  20.     private static ArrayList data;  
  21.   
  22.     public static void loadData() {  
  23.         Thread thread = new Thread(new Runnable() {  
  24.             @Override  
  25.             public void run() {  
  26.                 data = HttpUtils.getData();  
  27.             }  
  28.         });  
  29.         thread.start();  
  30.         try {  
  31.             thread.join();  
  32.         } catch (InterruptedException e) {  
  33.             e.printStackTrace();  
  34.         }  
  35.     }  
  36.   
  37.     class RemoteViewsFactoryImp implements RemoteViewsFactory {  
  38.         private Intent requestIntent;  
  39.         private Context requestContext;  
  40.   
  41.   
  42.         public RemoteViewsFactoryImp(Context context, Intent intent) {  
  43.             requestContext = context;  
  44.             requestIntent = intent;  
  45.         }  
  46.   
  47.         @Override  
  48.         public void onCreate() {  
  49.             loadData();  
  50.         }  
  51.   
  52.         @Override  
  53.         public void onDataSetChanged() {  
  54.   
  55.         }  
  56.   
  57.         @Override  
  58.         public void onDestroy() {  
  59.   
  60.         }  
  61.   
  62.         @Override  
  63.         public int getCount() {  
  64.             return data.size();  
  65.         }  
  66.   
  67.         @Override  
  68.         public RemoteViews getViewAt(int position) {  
  69.             RemoteViews remoteViews = new RemoteViews(requestContext.getPackageName(), R.layout.widget_item_layout);  
  70.   
  71.             remoteViews.setTextViewText(R.id.item_textView, data.get(position));  
  72.             return remoteViews;  
  73.         }  
  74.   
  75.         @Override  
  76.         public RemoteViews getLoadingView() {  
  77.             return null;  
  78.         }  
  79.   
  80.         @Override  
  81.         public int getViewTypeCount() {  
  82.             return 1;  
  83.         }  
  84.   
  85.         @Override  
  86.         public long getItemId(int position) {  
  87.             return position;  
  88.         }  
  89.   
  90.         @Override  
  91.         public boolean hasStableIds() {  
  92.             return false;  
  93.         }  
  94.     }  
  95. }  

这里我使用了一个类来加载网上的数据,当然你可以用自己的方式去现实数据,这里可能有个方法大家不是很懂,就是那个tread.join()方法,它的作用是在线程执行完run方法之后再执行join后面的代码,我这里使用的目的是做有个同步,也就是在数据下载完成后再执行后面的代码。工具类这里就不贴代码了。

到这里我们就可以运行看下效果了。我的运行效果如下:

AppWidget实现自定义view_第2张图片

OK,下面我们给listview加上交互,给每一个item添加上点击事件,需要做需改provider和factory里面的代码,修改完成后的代码如下:

provider中的代码:

[java] view plain copy print ?
  1. package com.example.leixinxue.widgettest;  
  2.   
  3. import android.app.PendingIntent;  
  4. import android.appwidget.AppWidgetManager;  
  5. import android.appwidget.AppWidgetProvider;  
  6. import android.content.Context;  
  7. import android.content.Intent;  
  8. import android.widget.RemoteViews;  
  9. import android.widget.Toast;  
  10.   
  11. /** 
  12.  * Created by leixinxue on 16-8-8. 
  13.  */  
  14.   
  15. public class WidgetProviderClass extends AppWidgetProvider {  
  16.     public static final String BTNACTION = "com.xinxue.action.TYPE_BTN";  
  17.     public static final String ITEMCLICK = "com.xinxue.action.TYPE_LIST";  
  18.   
  19.     @Override  
  20.     public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {  
  21.         super.onUpdate(context, appWidgetManager, appWidgetIds);  
  22.         RemoteViews remoteViews = new RemoteViews(context.getPackageName(), R.layout.widget_layout);  
  23.   
  24. //绑定service用来填充listview中的视图  
  25.         Intent intent = new Intent(context, RemoteViewServiceImp.class);  
  26.         remoteViews.setRemoteAdapter(R.id.widget_listview, intent);  
  27. //添加item的点击事件  
  28.         Intent intent1 = new Intent(ITEMCLICK);  
  29.         PendingIntent pendingIntent = PendingIntent.getBroadcast(context, 1, intent1, PendingIntent.FLAG_CANCEL_CURRENT);  
  30.         remoteViews.setPendingIntentTemplate(R.id.widget_listview, pendingIntent);  
  31.   
  32.   
  33.         //如果你添加了多个实例的情况下需要下面的处理  
  34.         for (int i = 0; i < appWidgetIds.length; i++) {  
  35.             appWidgetManager.updateAppWidget(appWidgetIds[i], remoteViews);  
  36.         }  
  37.     }  
  38.   
  39.     @Override  
  40.     public void onReceive(Context context, Intent intent) {  
  41.         super.onReceive(context, intent);  
  42.         if (intent.getAction().equals(ITEMCLICK)) {  
  43.             Toast.makeText(context, intent.getIntExtra("position"0) + "", Toast.LENGTH_SHORT).show();  
  44.         }  
  45.     }  
  46. }  
factory中的代码:
[java] view plain copy print ?
  1. package com.example.leixinxue.widgettest;  
  2.   
  3. import android.content.Context;  
  4. import android.content.Intent;  
  5. import android.widget.RemoteViews;  
  6. import android.widget.RemoteViewsService;  
  7.   
  8. import java.util.ArrayList;  
  9.   
  10. /** 
  11.  * Created by leixinxue on 16-8-8. 
  12.  */  
  13.   
  14. public class RemoteViewServiceImp extends RemoteViewsService {  
  15.     @Override  
  16.     public RemoteViewsFactory onGetViewFactory(Intent intent) {  
  17.         return new RemoteViewsFactoryImp(this, intent);  
  18.     }  
  19.   
  20.     private static ArrayList data;  
  21.   
  22.     public static void loadData() {  
  23.         Thread thread = new Thread(new Runnable() {  
  24.             @Override  
  25.             public void run() {  
  26.                 data = HttpUtils.getData();  
  27.             }  
  28.         });  
  29.         thread.start();  
  30.         try {  
  31.             thread.join();  
  32.         } catch (InterruptedException e) {  
  33.             e.printStackTrace();  
  34.         }  
  35.     }  
  36.   
  37.     class RemoteViewsFactoryImp implements RemoteViewsFactory {  
  38.         private Intent requestIntent;  
  39.         private Context requestContext;  
  40.   
  41.   
  42.         public RemoteViewsFactoryImp(Context context, Intent intent) {  
  43.             requestContext = context;  
  44.             requestIntent = intent;  
  45.         }  
  46.   
  47.         @Override  
  48.         public void onCreate() {  
  49.             loadData();  
  50.         }  
  51.   
  52.         @Override  
  53.         public void onDataSetChanged() {  
  54.   
  55.         }  
  56.   
  57.         @Override  
  58.         public void onDestroy() {  
  59.   
  60.         }  
  61.   
  62.         @Override  
  63.         public int getCount() {  
  64.             return data.size();  
  65.         }  
  66.   
  67.         @Override  
  68.         public RemoteViews getViewAt(int position) {  
  69.             RemoteViews remoteViews = new RemoteViews(requestContext.getPackageName(), R.layout.widget_item_layout);  
  70.             //listview的点击事件  
  71.             Intent intent = new Intent(WidgetProviderClass.ITEMCLICK);  
  72.             intent.putExtra("position", position);  
  73.             remoteViews.setOnClickFillInIntent(R.id.item_textView, intent);  
  74.   
  75.   
  76.             remoteViews.setTextViewText(R.id.item_textView, data.get(position));  
  77.             return remoteViews;  
  78.         }  
  79.   
  80.         @Override  
  81.         public RemoteViews getLoadingView() {  
  82.             return null;  
  83.         }  
  84.   
  85.         @Override  
  86.         public int getViewTypeCount() {  
  87.             return 1;  
  88.         }  
  89.   
  90.         @Override  
  91.         public long getItemId(int position) {  
  92.             return position;  
  93.         }  
  94.   
  95.         @Override  
  96.         public boolean hasStableIds() {  
  97.             return false;  
  98.         }  
  99.     }  
  100. }  

我们运行看下效果,OK,完美。到这里你可能已经学完了APPwidget的教程了,看Google的官方API你可能学到的也就只有这些。


全球首创让你的APPwidget实现自定义view

博客地址:blog.csdn.net/qq379454816------>欢乐斗佛的博客

我们都知道,产品经理大部分是SB,他们不知道怎么去编程,不知道一个模块的功能怎么去实现,可是他们为了酷炫,就是设计出一些很难实现的效果图,如果它设计一个很难得效果图,而这个效果图无法使用基本的视图去实现,必须要用自定义的方式去实现,而APPwidget又不支持自定义view,难道我们用修改底层framework的方式去实现?这当然是一种解决问题的办法,但是这个通常是无法实现的,于是乎你就百度一下,高级一点的屌丝程序员可能Google一下,结果很让人懵逼啊,能搜到几个条目告诉你怎么用自定义view去实现,可是打开一看~~~~~MD,修改framework,额,再次懵逼~~~。绝境之中遇贵人这种桥段是电视惯用的伎俩,但也不是现实生活中没有这种情况,下面我就教你一种全宇宙独创的方式去实现一种自定义view来实现APPwidget无法实现自定义view的窘境,这种方式简单的一B啊,可是如果我不告诉你,你却一辈子也无法去实现,而一旦思路打开,你的奇思妙想就会如尿崩一发而不可收拾,那就是自定义图片!!!什么?这~~~~~。

我们知道APPwidget是可以使用imageview的,而remoteview中有一个方法可以实现替换imageview中的图片:remoteViews.setImageViewBitmap(int viewid,Bitmap bitmap);两个参数,第一个为我们的imageview的id,第二个就是一个图片,imageview我们不可以动手脚,可是这个bitmap的来源我们就可以自己去把控了,你可以使用一个图片利用bitmapfactory来转换,可以使用xml文件来定义一个图片,最大自由度的使用方式是自定义一个bitmap,然后在这个bitmap上面实现我们的复杂效果。考虑到这篇文章前前后后的写了快一个月了,中间还有好多效果图没有给出,而工作忙的我实在没有大片的时间去完善这篇文章,不过中间的步骤什么的我是描述清楚了,上面两种方式的实现百度上面也有相应的文章,这里就部打算去完善了,重点给这个自定义的东西写一下,大家如果对前面的东西还有不明白的地方可以给我留言或者私信。


ok,废话说了一大篇,该是进入正题了。要实现一个自定义的bitmap,我们首先想到是继承 bitmap(有想到继承view的可以在下面排个队,到我这里领赏),可是当继承它的时候你会发现报错了,鼠标一上去一看~~额,bitmap是final类型的,你妹哦!android中图片还有一种方式就是drawable,该方法可以正常使用,不过其尺寸什么的不好去控制,转换bitmap的时候也好麻烦,这里我们就不用该方法了,我们知道自定义都离不开canvas,而构建一个canvas的时候其构造方法中可以传入一个bitmap,那我们何不就此入手实现我们的效果图!这里我说下思路,canvas就好比一个画布,而bitmap就好比一个布,我们给画布上面的布替换成bitmap这块布,然后所有的东西都画到这个布上面,这样bitmap就有内容了,再拿到这个bitmap我们就可以实现我们的目的了。大概就是这样一个过程,我先贴上我在乐视管家项目中的效果图:

AppWidget实现自定义view_第3张图片



录了一个视频,本来想上传给大家看的,奈何csdn不让传,本来想转成gif的,结果它必须要小于2M才可以上传,转换之后看不清就算了,这里就简单的给家描述一下吧。这个小组件分为3个模块,分别监测手机流量、内存、存储三个的使用情况,会动态的刷新,会随着主题的变化切换对应的颜色。实现思路就是使用一个service每2秒刷新一次,上面的视图都是3个imageview,而imageview的图片是使用画笔绘制到一个bitmap上的,因为设计到一些隐私,这里就不把所有的代码分享给大家了,就给一些必要的代码贴出来给你们吧。

首先这个是管家app的小组件,我们来看下他的provider里面的代码:

[java] view plain copy print ?
  1. public class SMWidgetProvider extends AppWidgetProvider {  
  2.     private static final String TAG = "smw";  
  3.     public static final String FILE_WIDGET_NAME = "widgetId.txt";  
  4.     public static final String SP_BASE_KEY = "widgetid_";  
  5.     private static final String ACTION_WALLPAPER_COLOR_CHANGE = "com.android.launcher3.WALLPAPER_MASTER_COLOR_CHANGE";//壁纸改变广播  
  6.     private static final String EXTRA_WHITE_WALLPAPER = "whiteWallpaper";  
  7.     public static final String ISWHITEWALLER_FILENAME = "isWhiteWaller";  
  8.     public static final String ISWHITEWALLER = "isWhiteWaller";  
  9.   
  10.     //小组件更新的时候调用的方法  
  11.     @Override  
  12.     public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) {  
  13.         super.onUpdate(context, appWidgetManager, appWidgetIds);  
  14.         WidgetUtils.savaToFile(context, appWidgetIds);//存储id值  
  15.         RVSet.getFlowState(context);//根据卡的情况显示对应的视图  
  16.     }  
  17.   
  18.     @Override  
  19.     public void onEnabled(Context context) {  
  20.         context.startService(new Intent(context, WidgetUpdateService.class));  
  21.         super.onEnabled(context);  
  22.     }  
  23.   
  24.     @Override  
  25.     public void onDisabled(Context context) {  
  26.         context.stopService(new Intent(context, WidgetUpdateService.class));  
  27.         context.getSharedPreferences(FILE_WIDGET_NAME, Context.MODE_PRIVATE).edit().clear();  
  28.         super.onDisabled(context);  
  29.     }  
  30.   
  31.     @Override  
  32.     public void onReceive(Context context, Intent intent) {  
  33.         RVSet.toDrawText = WidgetUtils.getUnit(context);  
  34.         RVSet.memoryInfo = WidgetUtils.getMemoryInfo(context);  
  35.         super.onReceive(context, intent);  
  36.         String action = intent.getAction();  
  37.         if (ACTION_WALLPAPER_COLOR_CHANGE.equals(action)) {  
  38.             context.getSharedPreferences(ISWHITEWALLER_FILENAME, Context.MODE_PRIVATE).edit()  
  39.                     .putBoolean(ISWHITEWALLER, intent.getBooleanExtra(EXTRA_WHITE_WALLPAPER, false)).commit();  
  40.             // 更新UI  
  41.             onUpdate(context, AppWidgetManager.getInstance(context), WidgetUtils.readWidgetId(context));  
  42.         }  
  43.         if (WidgetUpdateService.ACTION_SUPERMANAGER_UPDATE.equals(action)) {  
  44.             // 更新UI  
  45.             onUpdate(context, AppWidgetManager.getInstance(context), WidgetUtils.readWidgetId(context));  
  46.             Log.d(TAG, "get smwidgetprovider broadcast!");  
  47.         }  
  48.     }  
  49.   
  50.   
  51.     @Override  
  52.     public void onDeleted(Context context, int[] appWidgetIds) {  
  53.         super.onDeleted(context, appWidgetIds);  
  54.         //清除id值  
  55.         SharedPreferences sp = context.getSharedPreferences(FILE_WIDGET_NAME, Context.MODE_PRIVATE);  
  56.         for (int id : appWidgetIds) {  
  57.             sp.edit().remove(SP_BASE_KEY + id).commit();  
  58.         }  
  59.     }  
  60. }  

这里我们只需要看RVSet这个类,别的都是有些启动服务啊存储小组件id什么的,因为要在别的类中使用小组件id,以及开机的时候还能更新小组件,所已使用sharedpreferences来存储。而RVSet是一个工具类,用来处理收到广播的一些逻辑,以及点击事件的设置等,这里我们调用了 RVSet.getFlowState(context),那么我们来看看里面的代码:
[java] view plain copy print ?
  1. public static void getFlowState(final Context context) {  
  2.       //读取壁纸的值  
  3.       isWhiteWaller = context.getSharedPreferences(SMWidgetProvider.ISWHITEWALLER_FILENAME, Context.MODE_PRIVATE).getBoolean(SMWidgetProvider.ISWHITEWALLER, false);  
  4.       textColor = isWhiteWaller ? Color.BLACK : Color.WHITE;  
  5.       appWidgetManager = AppWidgetManager.getInstance(context);  
  6.       appWidgetIds = WidgetUtils.readWidgetId(context);  
  7.       remoteViews = new RemoteViews(context.getPackageName(), R.layout.widget_main_layout);  
  8.       if (!PermissionUtil.isPermissionPhone(context)) {  
  9.           //无授权情况  
  10.           Log.d(TAG, "getFlowState-->no permission");  
  11.           CURRENT_SIM_TYPE = SIM_TYPE_NO_PERMISSION;  
  12.           drawMemoryAndStorage(context);  
  13.           startUpdate();  
  14.           return;  
  15.       }  
  16.       getSimCount(context, TelephonyUtil.getActiveSIMCount());//标志卡的数量  
  17.   }  
isWhiteWaller是判断手机当前的壁纸是亮色的还是暗色的,让后更新对应的颜色,getSimCount()该方法用来判断手机当前是几张卡,startUpdate()用来更新桌面的视图,我们来看下里面的代码:
[java] view plain copy print ?
  1. //更新  
  2.    private static void startUpdate() {  
  3.        for (int id : appWidgetIds) {  
  4.            appWidgetManager.updateAppWidget(id, remoteViews);  
  5.        }  
  6.    }  

直接使用上面的appwidgetIds来更新视图,重点是drawMemoryAndStorage()这个方法,该方法用来绘制后面的那两个模块,也就是内存和存储的模块,我们来看下里面的代码:
[java] view plain copy print ?
  1. //绘制内存和存储的状态  
  2.     private synchronized static void drawMemoryAndStorage(Context context) {  
  3.         //管家的Logo随着主题更改  
  4.         remoteViews.setImageViewBitmap(R.id.widget_img_logo, WidgetUtils.DrawableToBitmap(new OnAppIconLoad(context.getPackageName()).load(context)));  
  5.         //绘制图片  
  6.         Bitmap bitmapMemory = DrawUtils.TYPE_MEMORY.draw(context, WidgetUtils.getMemoryRat(), memoryInfo[0], memoryInfo[1]);  
  7.         Bitmap bitmapStorage = DrawUtils.TYPE_STORAGE.draw(context, WidgetUtils.storageUsedRat(), toDrawText[0], toDrawText[1]);  
  8.         //更新图片  
  9.         remoteViews.setImageViewBitmap(R.id.widget_imgv_memory, bitmapMemory);  
  10.         remoteViews.setImageViewBitmap(R.id.widget_imgv_storage, bitmapStorage);  
  11.         //设置字体的颜色  
  12.         setViewColor();  
  13.         //设置点击事件  
  14.         setBtnClick(context);  
  15.         startUpdate();  
  16.     }  

  方法:remoteViews.setImageViewBitmap(R.id.widget_imgv_memory, bitmapMemory);就是把绘制的视图更新到对应的imageview上面去,也就是利用这个方法的第二个参数,我们实现了自定义view。DrawUtils这个类也就是具体去绘制的类,该类我使用类枚举类来实现,里面的代码就是具体绘制3个圆圈,我给整个类的代码分享给大家吧,也算对开源事业做些贡献。代码如下:
[java] view plain copy print ?
  1. public enum DrawUtils {  
  2.     TYPE_FLOW, TYPE_MEMORY, TYPE_STORAGE;  
  3.     private float mProcess;//绘制的进度  
  4.     private String mInfo, unit;//绘制的文本信息  
  5.     private static int width, height;//圆环的宽高  
  6.     private RectF mRectF;  
  7.     private Bitmap bm, bitmap;  
  8.     private Canvas canvas;  
  9.     private Paint mPaint;  
  10.     private Context context;  
  11.   
  12.     //传入一些必要的信息  
  13.     public Bitmap draw(Context context, float process, String info, String unit) {  
  14.         mProcess = process;  
  15.         this.context = context;  
  16.         this.unit = unit;  
  17.         mInfo = info;  
  18.         init();  
  19.         //判断是那种类型的需求,然后调用对应的方法绘制  
  20.         switch (this) {  
  21.             case TYPE_FLOW:  
  22.                 bm = drawTypeFlow();  
  23.                 break;  
  24.             case TYPE_MEMORY:  
  25.                 bm = drawTypeMemory();  
  26.                 break;  
  27.             case TYPE_STORAGE:  
  28.                 bm = drawTypeStorage();  
  29.                 break;  
  30.         }  
  31.         return bm;  
  32.     }  
  33.   
  34.     //初始化操作  
  35.     private void init() {  
  36.         int circleWidth = DensityUtil.dip2px(context, 2);  
  37.         width = height = DensityUtil.dip2px(context, 80);  
  38.         mRectF = new RectF(circleWidth, circleWidth, width - circleWidth, height - circleWidth);  
  39.         mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);  
  40.         mPaint.setDither(true);  
  41.         mPaint.setStrokeWidth(circleWidth);  
  42.         mPaint.setStyle(Paint.Style.STROKE);  
  43.         int c = RVSet.isWhiteWaller ? Color.argb(26000) : Color.argb(100255255255);  
  44.         mPaint.setColor(c);  
  45.         mPaint.setFilterBitmap(false);  
  46.         bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);  
  47.         canvas = new Canvas(bitmap);  
  48.     }  
  49.   
  50.     //绘制剩余流量  
  51.     private Bitmap drawTypeFlow() {  
  52.         // 绘制圆圈,进度条背景  
  53.         canvas.drawArc(mRectF, 0360false, mPaint);  
  54.         mPaint.setColor(RVSet.CIRCLE_COLOR);  
  55.         canvas.drawArc(mRectF, 270, mProcess * 360false, mPaint);  
  56.         drawText(canvas);  
  57.         return bitmap;  
  58.     }  
  59.   
  60.   
  61.     //绘制内存情况  
  62.     private Bitmap drawTypeMemory() {  
  63.         mPaint.setStrokeWidth(DensityUtil.dip2px(context, 4));  
  64.         float dashWidth = DensityUtil.dip2px(context, 3) - 0.5f;//因为DensityUtil工具在转换的时候多加了0.5像素导致出现刻度  
  65.         int totalCount = (int) Math.ceil(310 / dashWidth);//算出需要绘制的个数  
  66.         DashPathEffect dash = new DashPathEffect(new float[]{DensityUtil.dip2px(context, 1) - 0.5f, DensityUtil.dip2px(context, 2) - 0.5f}, 0);  
  67.         mPaint.setPathEffect(dash);  
  68.         float drawLength = (float) (Math.ceil(mProcess * totalCount) * dashWidth);//剩余部分  
  69.         canvas.drawArc(mRectF, 115, totalCount * dashWidth - drawLength, false, mPaint);  
  70.         mPaint.setColor(Color.parseColor("#00fe8f"));  
  71.         canvas.drawArc(mRectF, 115 + totalCount * dashWidth - drawLength, drawLength, false, mPaint);  
  72.         drawText(canvas);  
  73.         return bitmap;  
  74.     }  
  75.   
  76.     //绘制存储情况  
  77.     private Bitmap drawTypeStorage() {  
  78.         //每一份的宽度,总共分了8份  
  79.         double v = mRectF.width() * Math.PI / 8;  
  80.         DashPathEffect dash = new DashPathEffect(new float[]{(float) (v - DensityUtil.dip2px(context, 1)), DensityUtil.dip2px(context, 1)}, 0);  
  81.         mPaint.setPathEffect(dash);  
  82.         canvas.drawArc(mRectF, 270360false, mPaint);  
  83.         mPaint.setColor(Color.parseColor("#acfa15"));  
  84.         canvas.drawArc(mRectF, 270360 * mProcess, false, mPaint);  
  85.         drawText(canvas);  
  86.         return bitmap;  
  87.     }  
  88.   
  89.     /** 
  90.      * 因为要绘制两遍,而两遍的文字不一样大,所以需要测量两遍字体的高度 
  91.      * 
  92.      * @param canvas 
  93.      */  
  94.     private void drawText(Canvas canvas) {  
  95.         int c = RVSet.isWhiteWaller ? Color.BLACK : Color.WHITE;  
  96.         mPaint.setColor(c);  
  97.         mPaint.setStyle(Paint.Style.FILL);  
  98.         overRun();//判断是否超限  
  99.         //上面的字体高度  
  100.         mPaint.setTextSize(DensityUtil.dip2px(context, 20));  
  101.         Paint.FontMetrics fontMetrics = mPaint.getFontMetrics();  
  102.         int textWidth = (int) mPaint.measureText(mInfo, 0, mInfo.length());  
  103.         //下面的字体高度  
  104.         mPaint.setTextSize(DensityUtil.dip2px(context, 12));  
  105.         Paint.FontMetrics fontMetrics1 = mPaint.getFontMetrics();  
  106.         int textWidth1 = (int) mPaint.measureText(unit, 0, unit.length());  
  107.         //绘制数字  
  108.         float theY = mRectF.centerY() - fontMetrics.descent + (fontMetrics.bottom - fontMetrics.top) / 2 - (fontMetrics1.descent - fontMetrics1.ascent) / 2;  
  109.         mPaint.setTextSize(DensityUtil.dip2px(context, 20));  
  110.         canvas.drawText(mInfo, width / 2 - textWidth / 2, theY, mPaint);  
  111.         //绘制单位  
  112.         mPaint.setTextSize(DensityUtil.dip2px(context, 12));  
  113.         float newY = theY + DensityUtil.dip2px(context, 4) + fontMetrics.bottom - fontMetrics1.descent + (fontMetrics1.descent - fontMetrics1.ascent) / 2;  
  114.         canvas.drawText(unit, width / 2 - textWidth1 / 2, newY, mPaint);  
  115.     }  
  116.   
  117.     //超限的情况  
  118.     private void overRun() {  
  119.         switch (this) {  
  120.             case TYPE_STORAGE:  
  121.                 if ((unit.equalsIgnoreCase("M") && Float.parseFloat(mInfo) < 200) || unit.equalsIgnoreCase("K") || unit.equalsIgnoreCase("B"))  
  122.                     mPaint.setColor(Color.parseColor("#ff840b"));  
  123.                 break;  
  124.             case TYPE_MEMORY:  
  125.                 if ((unit.equalsIgnoreCase("M") && Float.parseFloat(mInfo) < 100) || unit.equalsIgnoreCase("K") || unit.equalsIgnoreCase("B"))  
  126.                     mPaint.setColor(Color.parseColor("#ff840b"));  
  127.                 break;  
  128.             case TYPE_FLOW://流量超限  
  129.                 break;  
  130.         }  
  131.     }  
  132.   
  133. }  

3个圆圈的绘制没有超过200行代码,大家看起来应该不是很费劲,步骤就是这样的,首先我们创建了一个矩阵,利用它我们就可以画一个圆,这里我要告诉大家的是,安卓中的圆和椭圆都是使用矩形画内切圆来实现的,然后那个bitmap是使用canvas在上面绘制的,最后把这个bitmap返回出去,因为是枚举类,所以他们各自的逻辑是不会干预的,所以每次画布和画布的控制就省了很多代码,这也算一个小技巧吧,用来枚举类我们可以解决很多彼此相似又不是同一个实体的问题,所以大家一定要学好它。ok,到这里我们将的也差不多了,如果还有不懂的地方,欢迎大家留言。


写在最后

小组件这个功能平时使用的也不是很多,google对齐的设计也是烂的一比,各种限制各种加载出错,自由度非常的差,所以往往市面上面的小组件也不是特别的酷炫,要是非要自己去定制的话目前应该只有这个教程可以帮你完美的完成,文章前前后后写了一个多月,中间断了很久,本来不打算写的了,事情拖得越久越不想去做,但是前段时间发现我还没有写完的文章居然被编辑推荐到首页了,激动的左摇右晃呀,于是乎拼命的提醒自己一定要完成一定要完成,现在终于告一段落了,写了这么多篇文章,这篇算是最长最用心的了,以后我会写好每篇文章,最求的不再是数量而是质量。目前移动行业这么火,门槛又不是很高,培训出来的人一大堆,导致很多人找不到工作,开发出来的软件质量也是烂的一B,真是无力吐槽~~我们要学的东西还很多,比起大学里也想我们确实很了不起了,比起你心目中的自己,你是非常的优秀了,能照着百度敲代码上班,能月薪过万,很是得意洋洋,这也就是为什么软件会有那么多莫名其妙的crash的原因。开发软件就像使用电脑一样,易懂难精,要开发优质的软件,写出精炼的代码,需要非常深的功力,需要对android底层非常的熟悉。安卓是一个系统,要学透不是那么简单的,所以平时希望大家静下心来,扎实的学,不要成为别人口中的程序员,工程师才是你们的目标。好来,最后来说下今天的主题吧,小组件是利用远程广播来更新视图,内容载体是remoteview,实时刷新需要我们自己开一个服务动态的发送广播更新,利用imageview中的bitmap我们实现了自定义view,利用自定义view我们就可以生成绚丽多彩的画面,实现我们的需求。好啦,谢谢大家能耐心的看到这里~~完

你可能感兴趣的:(android)