欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android小掛件(APP Widgets)設(shè)計(jì)指導(dǎo)

 更新時(shí)間:2016年12月09日 11:04:48   作者:LanTingShuXu  
這篇文章主要為大家詳細(xì)介紹了Android小掛件APP Widgets設(shè)計(jì)指導(dǎo),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

應(yīng)用小掛件(也叫做窗口小掛件)在android1.5的時(shí)候被第一次引出,后來(lái)再android3.0和android3.1中得到了極大的發(fā)展,他們可以展示一些應(yīng)用的常用信息或者一些相關(guān)的信息到桌面上,標(biāo)準(zhǔn)的Android系統(tǒng)鏡像中有很多自帶的創(chuàng)口小掛件,例如:鬧鐘、音樂(lè)等

Figure 1. Example app widgets in Android 4.0.

本文將描述怎么去設(shè)計(jì)小掛件,以便于能很好的與其他掛件搭配的很默契,同時(shí)也會(huì)介紹一些小技巧。

AppWidget 剖析

       一個(gè)典型的android掛件將會(huì)包含三個(gè)組件部分:一個(gè)邊界框、一個(gè)掛件圖形控件、其他的元素。掛件包含了一部分安卓 View 控件的子集,他支持:textlabel、button、image。其他可用的組件見(jiàn)API Guide部分的Creating the app widget layout(見(jiàn)左側(cè))

       一個(gè)設(shè)計(jì)很好的掛件將會(huì)在邊界框、框架之間留出一些外部邊界,在內(nèi)部的邊界框中會(huì)留出一些內(nèi)部邊界。(也就是留出一些padding與margin)。如下圖所示:

Figure 2. Widgets generally have margins between the bounding box and frame,and padding between the frame and widget control

Note:
在android4.0中,掛件將自動(dòng)的與邊框之間將上margin。

為你的掛件決定大小

        每一個(gè)掛件都必須指定minWidth 和 minHeight他表示默認(rèn)最少需要多少的空間展示。當(dāng)用戶(hù)添加掛件到他的主屏幕時(shí),通常占用的空間會(huì)大于你給的這兩個(gè)值。Android的主屏幕提供給用戶(hù)一種方格子的可用空間來(lái)放置應(yīng)用圖標(biāo)或者桌面掛件。這種矩陣方格子在不同的設(shè)備上有不同的格式。比如說(shuō):一般手持設(shè)備提供4 X 4的格子。但是平板設(shè)備可以通過(guò)8 X 7的格子。當(dāng)你的掛件被添加的時(shí)候,他將會(huì)根據(jù)minWidth和minHeight指定的寬高自動(dòng)拉伸去占據(jù)最少的格子。使用.9.png圖片作為背景和使用可伸展的布局可使你的掛件布局能很好的適配設(shè)備的主屏幕格子,以達(dá)到很好的使用體驗(yàn)。
        你設(shè)置的寬度、高度,或者說(shuō)margin寬度都會(huì)有可能運(yùn)行到不同的設(shè)備上,你可以使用下面列出的每個(gè)小格子占據(jù)的空間的數(shù)據(jù)來(lái)大致的估算你的掛件的最小尺寸。

最佳實(shí)踐是將你的minWidth與minHeight設(shè)置相對(duì)保守,定義最小尺寸是可以使你的掛件渲染出很好的默認(rèn)狀態(tài)。

        比如說(shuō):假設(shè)你有個(gè)音樂(lè)播放器的掛件,他用作顯示當(dāng)前正在播放的專(zhuān)輯以及名字,我們就只需要一個(gè)播放按鈕、一個(gè)下一曲按鈕。

Figure 3. An example music player widget.

你最小的高度就應(yīng)該為你的兩個(gè)文本控件的高度+文本之間的margin高度和padding高度。你的最小寬度就應(yīng)該為播放按鈕最短寬度+ 下一曲按鈕的最短寬度 + 文本的最短寬度(比如說(shuō)最長(zhǎng)10個(gè)字符)+水平的一些margin和padding距離

Figure4. Example sizes and margins for minWidth/minHeight calculations.We chose 144dp as an example good minimum width for the text labels.

最后的結(jié)果如下:

minWidth = 144dp + (2 × 8dp) + (2 × 56dp) = 272dp
minHeight = 48dp + (2 × 4dp) = 56dp

如果你使用的.9.png圖片與內(nèi)容有固有的padding距離,你也需要加上.

可調(diào)節(jié)大小的掛件

在android 3.1以后,掛件在水平方向與豎直方向都可以被調(diào)節(jié)大小,意味著:minWidth和minHeight的值將變成掛件默認(rèn)大小的值,你可以使用minResizeWidthminResizeHeight來(lái)表示掛件真正的最小值,小于這個(gè)值時(shí),控件將變得模糊和不可用。 

特別是那些基于ListView或者GridView的集合類(lèi)特征的掛件 

為你的掛件添加margin(外邊界寬度)

       正如前面提到的,android4.0將可以為主屏幕的掛件自動(dòng)添加小號(hào)、標(biāo)準(zhǔn)的外邊界寬度(margin)。對(duì)于那些系統(tǒng)版本號(hào)在14或者以上的來(lái)說(shuō),為了平衡主屏幕的視覺(jué),我們不推薦你再額外的添加margin到你的掛件外部。
        當(dāng)然,對(duì)于那個(gè)更早一些的版本,添加自己的margin也不復(fù)雜,具體在API Guide中有介紹到。 

設(shè)計(jì)掛件的布局和背景圖片

       很多掛件都只有一個(gè)固定的矩形背景或者圓角矩形的形狀。其實(shí)最好的方法是使用.9.png圖片來(lái)定義。(具體怎么使用.9.png圖片,很簡(jiǎn)單這里不翻譯了,自己去找資料學(xué)習(xí)) 

        對(duì)于掛件的內(nèi)容部分,你應(yīng)該使用可伸縮的布局方式。例如:RelativeLayout、LinearLayout、或者FrameLayout。這樣可以讓你的布局文件去適應(yīng)很多種不同的屏幕尺寸。 

        下面是一個(gè)關(guān)于音樂(lè)播放的掛件的布局例子。他包含了一個(gè)文本域、一個(gè)暫停按鈕、一個(gè)、下一曲按鈕,他的margin取決于系統(tǒng)。

<FrameLayout 
 android:layout_width="match_parent" 
 android:layout_height="match_parent" 
 android:padding="@dimen/widget_margin"> 
  
 <LinearLayout 
  android:layout_width="match_parent" 
  android:layout_height="match_parent" 
  android:orientation="horizontal" 
  android:background="@drawable/my_widget_background"> 
  
  <TextView 
   android:id="@+id/song_info" 
   android:layout_width="0dp" 
   android:layout_height="match_parent" 
   android:layout_weight="1" /> 
  
  <Button 
   android:id="@+id/play_button" 
   android:layout_width="@dimen/my_button_width" 
   android:layout_height="match_parent" /> 
  
  <Button 
   android:id="@+id/skip_button" 
   android:layout_width="@dimen/my_button_width" 
   android:layout_height="match_parent" /> 
 </LinearLayout> 
</FrameLayout> 

如果你看了上面的例子和說(shuō)明,你也可以開(kāi)始做一個(gè)有彈性的布局

Figure 6. Excerpt flexible layouts and attributes.

使用掛件模板包

當(dāng)你要開(kāi)始設(shè)計(jì)一個(gè)新的掛件或者更新現(xiàn)有的掛件,你可以先看一下下面的設(shè)計(jì)模板。下面的包是可以下載的,他包含了.9.png背景圖片和XML和一些針對(duì)不同像素密度的PS文件

下面是一個(gè)實(shí)例源代碼

/* 
 * Copyright (C) 2009 The Android Open Source Project 
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); 
 * you may not use this file except in compliance with the License. 
 * You may obtain a copy of the License at 
 * 
 *   http://www.apache.org/licenses/LICENSE-2.0 
 * 
 * Unless required by applicable law or agreed to in writing, software 
 * distributed under the License is distributed on an "AS IS" BASIS, 
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 
 * See the License for the specific language governing permissions and 
 * limitations under the License. 
 */ 
 
package com.example.android.wiktionary; 
 
import com.example.android.wiktionary.SimpleWikiHelper.ApiException; 
import com.example.android.wiktionary.SimpleWikiHelper.ParseException; 
 
import android.app.PendingIntent; 
import android.app.Service; 
import android.appwidget.AppWidgetManager; 
import android.appwidget.AppWidgetProvider; 
import android.content.ComponentName; 
import android.content.Context; 
import android.content.Intent; 
import android.content.res.Resources; 
import android.net.Uri; 
import android.os.IBinder; 
import android.text.format.Time; 
import android.util.Log; 
import android.widget.RemoteViews; 
 
import java.util.regex.Matcher; 
import java.util.regex.Pattern; 
 
/** 
 * Define a simple widget that shows the Wiktionary "Word of the day." To build 
 * an update we spawn a background {@link Service} to perform the API queries. 
 */ 
public class WordWidget extends AppWidgetProvider { 
  /** 
   * Regular expression that splits "Word of the day" entry into word 
   * name, word type, and the first description bullet point. 
   */ 
  public static final String WOTD_PATTERN = 
    "(?s)\\{\\{wotd\\|(.+?)\\|(.+?)\\|([^#\\|]+).*?\\}\\}"; 
 
  @Override 
  public void onUpdate(Context context, AppWidgetManager appWidgetManager, int[] appWidgetIds) { 
    Log.d("WordWidget.UpdateService", "onUpdate()"); 
    // To prevent any ANR timeouts, we perform the update in a service 
    context.startService(new Intent(context, UpdateService.class)); 
  } 
  public static class UpdateService extends Service { 
    @Override 
    public void onStart(Intent intent, int startId) { 
      Log.d("WordWidget.UpdateService", "onStart()"); 
 
      // Build the widget update for today 
      RemoteViews updateViews = buildUpdate(this); 
      Log.d("WordWidget.UpdateService", "update built"); 
       
      // Push update for this widget to the home screen 
      ComponentName thisWidget = new ComponentName(this, WordWidget.class); 
      AppWidgetManager manager = AppWidgetManager.getInstance(this); 
      manager.updateAppWidget(thisWidget, updateViews); 
      Log.d("WordWidget.UpdateService", "widget updated"); 
    } 
 
    @Override 
    public IBinder onBind(Intent intent) { 
      return null; 
    } 
    /** 
     * Build a widget update to show the current Wiktionary 
     * "Word of the day." Will block until the online API returns. 
     */ 
    public RemoteViews buildUpdate(Context context) { 
      // Pick out month names from resources 
      Resources res = context.getResources(); 
      String[] monthNames = res.getStringArray(R.array.month_names); 
       
      // Find current month and day 
      Time today = new Time(); 
      today.setToNow(); 
 
      // Build the page title for today, such as "March 21" 
      String pageName = res.getString(R.string.template_wotd_title, 
          monthNames[today.month], today.monthDay); 
      String pageContent = null; 
       
      try { 
        // Try querying the Wiktionary API for today's word 
        SimpleWikiHelper.prepareUserAgent(context); 
        pageContent = SimpleWikiHelper.getPageContent(pageName, false); 
      } catch (ApiException e) { 
        Log.e("WordWidget", "Couldn't contact API", e); 
      } catch (ParseException e) { 
        Log.e("WordWidget", "Couldn't parse API response", e); 
      } 
       
      RemoteViews views = null; 
      Matcher matcher = null; 
       
        Prefs prefs = new Prefs(this); 
      if (pageContent == null) { 
        // could not get content, use cache 
        // could be null 
        pageContent = prefs.getPageContent(); 
      } 
       
      if (pageContent != null) { 
        // we have page content 
        // is it valid? 
        matcher = Pattern.compile(WOTD_PATTERN).matcher(pageContent); 
      } 
      if (matcher != null && matcher.find()) { 
        // valid content, cache it  
        // ensure that latest valid content is 
        // always cached in case of failures 
        prefs.setPageContent(pageContent); 
 
        // Build an update that holds the updated widget contents 
        views = new RemoteViews(context.getPackageName(), R.layout.widget_word); 
         
        String wordTitle = matcher.group(1); 
        views.setTextViewText(R.id.word_title, wordTitle); 
        views.setTextViewText(R.id.word_type, matcher.group(2)); 
        views.setTextViewText(R.id.definition, matcher.group(3).trim()); 
         
        // When user clicks on widget, launch to Wiktionary definition page 
        String definePage = String.format("%s://%s/%s", ExtendedWikiHelper.WIKI_AUTHORITY, 
            ExtendedWikiHelper.WIKI_LOOKUP_HOST, wordTitle); 
        Intent defineIntent = new Intent(Intent.ACTION_VIEW, Uri.parse(definePage)); 
        PendingIntent pendingIntent = PendingIntent.getActivity(context, 
            0 /* no requestCode */, defineIntent, 0 /* no flags */); 
        views.setOnClickPendingIntent(R.id.widget, pendingIntent); 
         
      } else { 
        // Didn't find word of day, so show error message 
        views = new RemoteViews(context.getPackageName(), R.layout.widget_message); 
        views.setTextViewText(R.id.message, context.getString(R.string.widget_error)); 
      } 
      return views; 
    } 
  } 
} 

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論