带有折叠工具栏的 RecyclerView 中的 Android 字母快速滚动视图 [英] Android alphabetical fast scrollview in RecyclerView with Collapsing toolbar

查看:36
本文介绍了带有折叠工具栏的 RecyclerView 中的 Android 字母快速滚动视图的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的应用程序中,我有这样的 activity_main.xml:-

<AppBarLayout><CollapsingToolbarLayout><图像视图/><工具栏/></CollapsingToolbarLayout></AppBarLayout><RecyclerView/></协调布局>

Layout.xml ----->>>

<android.support.design.widget.AppBarLayoutandroid:id="@+id/app_bar_layout"android:layout_width="match_parent"android:layout_height="wrap_content"机器人:fitsSystemWindows =真"android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"><android.support.design.widget.CollapsingToolbarLayoutandroid:id="@+id/collapsing_toolbar"android:layout_width="match_parent"android:layout_height="match_parent"app:layout_scrollFlags="scroll|exitUntilCollapsed"app:contentScrim="?attr/colorPrimary"应用程序:expandedTitleMarginStart="48dp"应用程序:expandedTitleMarginEnd="64dp"android:fitsSystemWindows="true"><图像视图android:id="@+id/imagetoolbar"android:layout_width="match_parent"android:layout_height="200dp"android:scaleType="centerCrop"机器人:fitsSystemWindows =真"android:foreground="@drawable/image_header_foreground"应用程序:layout_scrollFlags="滚动"app:layout_collapseMode="视差"/><android.support.v7.widget.Toolbarandroid:id="@+id/工具栏"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"app:popupTheme="@style/ThemeOverlay.AppCompat.Light"android:background="@drawable/theme_background"app:layout_collapseMode="pin" ><微调器android:id="@+id/spinner_nav"android:layout_width="wrap_content"android:layout_height="wrap_content"android:dropDownVerticalOffset="?attr/actionBarSize"/></android.support.v7.widget.Toolbar></android.support.design.widget.CollapsingToolbarLayout></android.support.design.widget.AppBarLayout><android.support.v7.widget.RecyclerViewandroid:id="@+id/列表"android:layout_width="match_parent"android:layout_height="match_parent"app:layout_behavior="@string/appbar_scrolling_view_behavior"/></android.support.design.widget.CoordinatorLayout><列表视图android:layout_width="200dp"android:layout_height="match_parent"android:id="@+id/导航列表"机器人:背景=#dedede"android:layout_gravity="开始"/></android.support.v4.widget.DrawerLayout>

现在我想将快速滚动包含在我的回收站视图中,以便可以在滚动时弹出图像日期.

此类滚动条的示例图像:-

我搜索了这个并尝试使用几个库,但我认为由于我的折叠工具栏,滚动条无法正常工作.

使用的滚动库截图:-

在我的例子中,滚动条从顶部开始,滚动计算也不正确.

请帮助解决这个问题.

谢谢

解决方案

我们需要SectionIndexer一些知识.这是SectionIndexer

随意询问您是否卡在代码之间的任何地方......

注意:- FastScroll 图像在不同版本的 android(例如:-棒棒糖、棉花糖等)中会有所不同,以下输出用于棒棒糖

对于自定义字母快速滚动视图,只需在 AppThemestyle.xml 文件中添加这两行.

<item name="android:fastScrollTextColor">@color/apptheme_color</item>//这用于Alphabetical Fast scrollView的颜色<item name="android:fastScrollPreviewBackgroundRight">@drawable/bg_default_focused_holo_light</item>//这是您要在Alphabetical Fast scrollView上设置的图像或可绘制文件

自定义快速 Scorll 输出 :-

In my application I have activity_main.xml like this:-

<Coordinator Layout>
   <AppBarLayout>
      <CollapsingToolbarLayout>
           <ImageView/>
           <Toolbar/>
       </CollapsingToolbarLayout>
   </AppBarLayout>
   <RecyclerView/>
</Coordinating Layout>

Layout.xml ----->>>

<?xml version="1.0" encoding="utf-8"?>



<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:ads="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/theme_background"
    android:id="@+id/drawerlayout"
    >


    <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        android:id="@+id/activity_main_id"
        tools:context="objectdistance.ajai.ram.sita.gallery.MainActivity">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/app_bar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fitsSystemWindows="true"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">


            <android.support.design.widget.CollapsingToolbarLayout
                android:id="@+id/collapsing_toolbar"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:layout_scrollFlags="scroll|exitUntilCollapsed"
                app:contentScrim="?attr/colorPrimary"
                app:expandedTitleMarginStart="48dp"
                app:expandedTitleMarginEnd="64dp"
                android:fitsSystemWindows="true">



                <ImageView
                    android:id="@+id/imagetoolbar"
                    android:layout_width="match_parent"
                    android:layout_height="200dp"
                    android:scaleType="centerCrop"
                    android:fitsSystemWindows="true"
                    android:foreground="@drawable/image_header_foreground"
                    app:layout_scrollFlags="scroll"
                    app:layout_collapseMode="parallax"/>

                <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize"
                    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                    android:background="@drawable/theme_background"
                    app:layout_collapseMode="pin" >

                    <Spinner
                        android:id="@+id/spinner_nav"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"

                        android:dropDownVerticalOffset="?attr/actionBarSize" />

                </android.support.v7.widget.Toolbar>

            </android.support.design.widget.CollapsingToolbarLayout>


        </android.support.design.widget.AppBarLayout>




        <android.support.v7.widget.RecyclerView
            android:id="@+id/list"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />




    </android.support.design.widget.CoordinatorLayout>


    <ListView
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:id="@+id/navlist"
        android:background="#dedede"
        android:layout_gravity="start" />

</android.support.v4.widget.DrawerLayout>

Now I want to include fast scrolling to my recyclerview such that the image date can be popup on scrolling.

Sample image of such scrollbar:-

I searched for this and tried using few libraries but I think due to my collapsing toolbar the scrollbar is not working properly.

Screenshot of scroll Library used:-

Here in my case the scroll bar is starting from top and the scroll computation is also not proper.

Please help solving this issue.

Thanks

解决方案

we want some Knowledge of SectionIndexer. Here is Doc of SectionIndexer.

We have to set TRUE setFastScrollEnabled(true) method, which is used with the LISTVIEW.......You can use recyclerview instead of listView in the below example....

this is activity

public class FastScoll extends ListActivity {

    ListView fruitView;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_fast_scoll);

        fruitView = (ListView) findViewById(android.R.id.list);

        fruitView.setFastScrollEnabled(true);
        String[] fruits = getResources().getStringArray(R.array.fruits_array);

        final List<String> fruitList = Arrays.asList(fruits);
        Collections.sort(fruitList);
        setListAdapter(new ListAdapter(this, fruitList));

        fruitView.setOnItemClickListener(new AdapterView.OnItemClickListener() {

            public void onItemClick(AdapterView<?> parent, View arg1,
                                    int position, long arg3) {
                Log.e("sushildlh",fruitList.get(position));
            }
        });

    }
}

this is the activity_fast_scoll.xml file

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="5dp" >

    <ListView
        android:id="@android:id/list"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scrollbarStyle="outsideOverlay" />

</RelativeLayout>

and this is my custom adapter with SectionIndexer....

public class ListAdapter extends ArrayAdapter<String> implements SectionIndexer {

    String[] sections;
    List<String> fruits;
    List<String> sectionLetters=new ArrayList<String>();

    public ListAdapter(Context context, List<String> fruitList) {
        super(context, android.R.layout.simple_list_item_1, fruitList);
        this.fruits = fruitList;

        for (int x = 0; x < fruits.size(); x++) {
            String fruit = fruits.get(x);
            String ch = fruit.charAt(0)+"";
            ch = ch.toUpperCase(Locale.US);

            sectionLetters.add(ch);
        }

        ArrayList<String> sectionList = new ArrayList<String>(sectionLetters);

        sections = new String[sectionList.size()];

        sectionList.toArray(sections);
    }

    public int getPositionForSection(int section) {

        Log.e("sushildlh", "" + section);
        return section;
    }

    public int getSectionForPosition(int position) {

        Log.d("sushildlh", "" + position);
        return position;
    }

    public Object[] getSections() {
        return sections;
    }
}

this is fruits array in string.xml file.

 <string-array name="fruits_array">
            <item>Apples</item>
            <item>Apricots</item>
            <item>Avocado</item>
            <item>Annona</item>
            <item>Banana</item>
            <item>Bilberry</item>
            <item>Blackberry</item>
            <item>Custard Apple</item>
            <item>Clementine</item>
            <item>Cantalope</item>
            <item>Coconut</item>
            <item>Currant</item>
            <item>Cherry</item>
            <item>Cherimoya</item>
            <item>Date</item>
            <item>Damson</item>
            <item>Durian</item>
            <item>Elderberry</item>
            <item>Fig</item>
            <item>Feijoa</item>
            <item>Grapefruit</item>
            <item>Grape</item>
            <item>Gooseberry</item>
            <item>Guava</item>
            <item>Honeydew melon</item>
            <item>Huckleberry</item>
            <item>Jackfruit</item>
            <item>Juniper Berry</item>
            <item>Jambul</item>
            <item>Jujube</item>
            <item>Kiwi</item>
            <item>Kumquat</item>
            <item>Lemons</item>
            <item>Limes</item>
            <item>Lychee</item>
            <item>Mango</item>
            <item>Mandarin</item>
            <item>Mangostine</item>
            <item>Nectaraine</item>
            <item>Orange</item>
            <item>Olive</item>
            <item>Prunes</item>
            <item>Pears</item>
            <item>Plum</item>
            <item>Pineapple</item>
            <item>Peach</item>
            <item>Papaya</item>
            <item>Passionfruit</item>
            <item>Pomegranate</item>
            <item>Pomelo</item>
            <item>Raspberries</item>
            <item>Rock melon</item>
            <item>Rambutan</item>
            <item>Strawberries</item>
            <item>Sweety</item>
            <item>Salmonberry</item>
            <item>Satsuma</item>
            <item>Tangerines</item>
            <item>Tomato</item>
            <item>Ugli</item>
            <item>Watermelon</item>
            <item>Woodapple</item>
        </string-array>

and finally this is the output of the these code....

Feel free to ask if you stuck anywhere in between code ....

Note:- FastScroll image will be differ in different version of android (eg:-lollipop,marshmallow,etc) below output is for lollipop

For Custom Alphabetical Fast scrollView just add these 2 line in your style.xml file in AppTheme.

<item name="android:fastScrollTextColor">@color/apptheme_color</item>         //this is used for the color of the Alphabetical Fast scrollView
<item name="android:fastScrollPreviewBackgroundRight">@drawable/bg_default_focused_holo_light</item>          //this is the image or and drawable file you want to set on Alphabetical Fast scrollView

Custom Fast Scorll Output :-

这篇关于带有折叠工具栏的 RecyclerView 中的 Android 字母快速滚动视图的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆