如何为Android应用程序创建导览

时间:2012-11-20 16:27:20

标签: android

几个月前,我给自己买了一台HTC ONE X.我很钦佩他们引导用户使用交互式小部件和帮助功能在手机中迈出第一步。

我想将这种功能添加到我们正在构建的应用程序Rogerthat中,但我想知道是否有工具/库可以帮助我实现这一目标?

5 个答案:

答案 0 :(得分:9)

Roman Nurik组建了一个名为“Wizard Pager”的图书馆来做这类事情。它可能会被用来做你所要求的。

https://plus.google.com/113735310430199015092/posts/6cVymZvn3f4

http://code.google.com/p/romannurik-code/source/browse/misc/wizardpager

更新

我认为这也可能对您有所帮助。它类似于在ICS +中首次运行Android rom时显示的巡视路线。

该库可用于任何版本的Android:

https://github.com/Espiandev/ShowcaseView

如果你想要连续的陈列柜,你可以看看这个扩展:

https://github.com/blundell/ShowcaseViewExample

Example

答案 1 :(得分:5)

我为我的应用做了导览,让用户可以浏览4个音符页面并查看说明。这是代码:

public static void tour(final Context context, final String title, final int pageNumber, 
                        final Drawable icon, final String[] pageMessage, final int[] layouts, final ViewGroup root) {
    Builder tourDialog = new AlertDialog.Builder(context);
    int nPage = 0;


    if (pageMessage!=null){
        tourDialog.setMessage(pageMessage[pageNumber]);
        nPage = pageMessage.length;
    }

    if (layouts!=null){         
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
        View layout1 = inflater.inflate(layouts[pageNumber], root);
        tourDialog.setView(layout1);
        //tourDialog.setView(views[pageNumber]);
        nPage = layouts.length;
    }


    tourDialog.setTitle(title+" (page "+(pageNumber+1)+"/"+nPage+")");

    tourDialog.setPositiveButton("Prev",
            new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int whichButton) {
                    tour(context, title,  pageNumber-1, icon, pageMessage,layouts, root);
                    return;
                }
            });


    tourDialog.setNeutralButton("Next",
            new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int whichButton) {
                    tour(context, title,  pageNumber+1, icon, pageMessage,layouts, root);
                    return;
                }
            });
    tourDialog.setNegativeButton("Ok",
            new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int whichButton) {
                    return;
                }
            });
    if (icon!=null)
        tourDialog.setIcon(icon);
    AlertDialog dialog = tourDialog.create();

    dialog.show();

    if (pageNumber==0)
        dialog.getButton(AlertDialog.BUTTON_POSITIVE).setEnabled(false);
    else if (pageNumber==nPage-1){
        dialog.getButton(AlertDialog.BUTTON_NEUTRAL).setEnabled(false); 
    }
}

使用示例:

int[] layout = {R.layout.note1, R.layout.note2, R.layout.note3, R.layout.note4}; //resource id of each page's layout
tour(context, "Notes ", 0,getResources().getDrawable(R.drawable.gmpte_logo_25px),null, layout, (ViewGroup) findViewById(R.id.root));

以及注释页面布局的示例:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:id="@+id/root"
  android:padding="10dip">

<TextView android:id="@+id/text_before"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:textColor="#FFF"
          android:textSize="16dp"
          android:text="@string/note1_before_text"
          android:layout_marginTop="10dp"/>
<ImageView android:id="@+id/image"
          android:contentDescription="@string/desc"
          android:src="@drawable/mylocation_blue"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_toRightOf="@+id/text_before"
          />
<TextView
    android:id="@+id/text_after"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/text_before"
    android:layout_below="@+id/image"
    android:text="@string/note1_after_text"
    android:textColor="#FFF"
    android:textSize="16dp" />
</RelativeLayout>

您需要为每个笔记页面编写自己的布局,但在每个页面中使用相同的ID(android:id="@+id/root")作为根布局。

答案 2 :(得分:3)

Showcase View Library绝对是你想要的:

Show case view lib

答案 3 :(得分:0)

使用ViewPager和片段显示帮助屏幕。你会找到很多相关信息。

答案 4 :(得分:0)

我写了一些小图书馆 这包含一个用于进行应用程序浏览的简单组件。 它对我的情况非常有限,但也许可能是你的情况。 单个LessonCardView第一次显示onstartactivity 或点击按钮 任何批评,帮助或建议将不胜感激。谢谢 https://github.com/dnocode/DnoLib