设为首页收藏本站

LUPA开源社区

 找回密码
 注册
文章 帖子 博客
LUPA开源社区 首页 业界资讯 技术文摘 查看内容

为你的Android应用增加本地搜索功能

2015-2-25 20:55| 发布者: joejoe0332| 查看: 1955| 评论: 0|原作者: LeoXu|来自: oschina

摘要: 介绍   搜索是各种应用程序的一个基本功能需求. 在我们的案例中,我们拥有一个餐厅的应用程序,需要它能让用户可以方便和快速的搜索菜品清单,找到他们想要的东西. 在本文中,我将会描述我在对UI进行持续的维护时 ...


代码示例 4 续

  需要在布局上考虑的另外一个问题就是屏幕的横向和纵向模式. 底下是 res/layout-land 目录中的 search_query_grid_results.xml 文件. 你可以从这儿发现 numColumns 被设置成了4,  除了这个值是2以外, res/layout-port 文件跟这个文件是一样的.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="5dp"
  android:paddingRight="5dp"
  android:paddingBottom="5dp"
  android:paddingTop="5dp"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            style="@style/FragmentTitle"
            android:text="Results For: " />
        <TextView android:id="@+id/txt_query"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            style="@style/OrderTitle"/>
    </LinearLayout>    
    <GridView 
      android:id="@+id/search_results"
      android:layout_width="fill_parent" 
      android:layout_height="0dp"
      android:paddingTop="10dp"
      android:numColumns="4"
      android:verticalSpacing="10dp"
      android:horizontalSpacing="10dp"
      android:layout_weight="1"
      android:stretchMode="columnWidth"
      android:gravity="center"/>
</LinearLayout>


  代码示例 5: 搜索视图的横向布局xml

图 2: 当用户点击时单项的详细视图


手势覆盖层(Gesture Overlay)

  要退出搜索视图,我们比较喜欢用横扫的手势让它向左或者向右滑走,类似于菜单剩余部分的视图页滚动效果. GestureDetector 在这样一个列表视图之上运行起来很不错, 但当与网格视图一起结合起来的时候并不会有效果. 因而我们只能转而去使用一个 GestureOverlayView. 你见更需要使用 GestureBuilder 应用程序构建一个手势库,这个应用程序可以再SDK示例 (例如. android\sdk\samples\android-19\legacy\GestureBuilder) 中找到. 在你的蛇摆上构建并运行这个应用,并使用它来命名和创建出手势. 把所有你需要的手势都添加好了(在我们的案例中,就是向左扫动和向右扫动), 然后就将‘gestures’文件从你的设备复制到 res/raw 目录中. 应用会告诉你将手势文件保存到哪个地方. 在我这儿,所有要做的就是通过USB连接我们设备,手势文件就在root目录中.

图 3: 手势构建应用程序以及我们所添加的手势截图


  你的文件一就位,用下面的代码修改 SearchResultsActivity 类:

1
2
GestureLibrary gestureLibrary;
GestureOverlayView gestureOverlayView;


代码示例 6 :  GestureOverlayView 的变量声明

  在 onCreate 方法中, 初始化视图,加载库文件,并设置当用户执行一个匹配的手势时要做什么的侦听器. 确保能匹配到你在库文件中创建的名称. 动画我们则准备在 overridePendingTransition 调用时执行它. 对于进入动画我们指定值为0,也就是没有动画。你可以创建一个空的动画XML文件,并且引用它, 但是会有相当大概率的次数中,系统会弄糊涂,输出的动画执行起来会非常快.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
gestureOverlayView = (GestureOverlayView)findViewById(R.id.gestures);
    //initialize the gesture library and set up the gesture listener
    gestureLibrary = GestureLibraries.fromRawResource(this, R.raw.gestures);
    gestureLibrary.load();
    gestureOverlayView.addOnGesturePerformedListener(new OnGesturePerformedListener(){
      @Override
      public void onGesturePerformed(GestureOverlayView view, Gesture gesture) {
        ArrayList<Prediction> prediction = gestureLibrary.recognize(gesture);
        if(prediction.size() > 0){
          String action= prediction.get(0).name;
          //our gesture library contains "left swipe" and "right swipe" gestures
          if("left swipe".equals(action)){
            //slide out to the left
            SearchResultsActivity.this.finish();
            overridePendingTransition(0, R.anim.move_left);
          else if("right swipe".equals(action)){
            //slide out to the right
            SearchResultsActivity.this.finish();
            overridePendingTransition(0, R.anim.move_right);
          }
        }
 
      }});
    //gesture is transparent (no longer a yellow line)
    gestureOverlayView.setGestureVisible(false);


代码示例 7: 在onCreate方法中初始化 GestureOverlayView

  下面是动画文件 move_left.xml: (除了toXDelta是正数之外 move_right.xml 跟 move_left.xml是一样的)

1
2
3
4
5
6
7
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="500"
    android:fromXDelta="0"
    android:toXDelta="-100%"
    android:interpolator="@android:anim/decelerate_interpolator"
/>


代码示例 8: 向左移动动画的代码

   注意当用在一个GestureOverlayView里面的时候,你的网格视图不能有一个0dp的layout_height值, 因为将真的只是0dp,而不是像我们想要的那样在一个线性布局中扩展开. 为了在我们的案例中适应这种情况,我们将layout_height设置成fill_parent. 我们有不想要我们的手势可见,并且我也不想有等待可见的手势渐变消失这种延时, 因此你会需要将 fadeOffset 和 fadeDuration 设置成 0.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<android.gesture.GestureOverlayView
    android:id="@+id/gestures"
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"
    android:fadeOffset="0"
    android:fadeDuration="0"
    android:eventsInterceptionEnabled="true">      
  <GridView 
      android:id="@+id/search_results"
      android:layout_width="fill_parent" 
      android:layout_height="fill_parent"
      android:paddingTop="10dp"
      android:numColumns="4"
      android:verticalSpacing="10dp"
      android:horizontalSpacing="10dp"
      android:layout_weight="1"
      android:stretchMode="columnWidth"
      android:gravity="center"/>
</android.gesture.GestureOverlayView>


  代码示例 9: 得到用于布局 xml 的 GestureOverlayView 的更新的 GridView 块


总结

  现在你已经了解到本地搜索可以被添加到Android应用程序中,此外还了解到一些关键的UI是怎么做出选择决策的. 我也指出了一些其中会出现的挑战,以及如何去避免他们. 你现在应该能够把搜索整合到你自己的应用程序去了,同时对用户体验进行更多的考虑.


引用

https://developer.android.com/training/search/index.html


有关作者

Whitney Foster 是Intel的软件解决方案组的软件工程师,工作于在Android应用程序上大规模应用的项目上.

*其它名称和品牌可能已经被声称是属于其它人的财产.
**这个实例的代码以Intel示例源代码许可证发布.


酷毙

雷人

鲜花

鸡蛋

漂亮
  • 快毕业了,没工作经验,
    找份工作好难啊?
    赶紧去人才芯片公司磨练吧!!

最新评论

关于LUPA|人才芯片工程|人才招聘|LUPA认证|LUPA教育|LUPA开源社区 ( 浙B2-20090187 浙公网安备 33010602006705号   

返回顶部