如何在AppBarLayout中添加pull to refresh

时间:2017-07-27 14:42:47

标签: android android-coordinatorlayout android-appbarlayout

我发现大部分材料都是关于讨论添加"拉动刷新"在AppBarLayout下面的区域,例如SwipeRefreshLayout,我想知道如何在AppBarLayout中执行此操作,这意味着:

enter image description here

下拉时,拉动刷新指示符会出现在AppBarLayout中。

如何实现这个?感谢

================= UPDATE ===================

我终于以自己的方式解决了这个问题。 Here是录制简单用户界面的视频链接。

关键是我从github重写了appbarlayout-spring-behavior。这真的很有帮助。简单地说,我重写了AppBarLayoutSpringBehavior,在draging时添加了Pull-To-Refresh-Callback,并添加了一些逻辑来显示pull-to-refresh动画,以防止简单地动画回到原始状态。过了一段时间,然后我告诉行为动画回来。

虽然重写代码看起来很难看,但似乎可行。我将重构我的代码,使其干净和模块化

4 个答案:

答案 0 :(得分:1)

我写了一个nestrefresh回购,您可以为与AppBarLayout相同的标题添加拉刷新。您可以在ViewPager中添加拉动以刷新子项,也可以拉动以加载更多子项。如果只想使用AppBarLayout,可以在我的仓库中使用ChildCoordinatorLayout来包装AppBarLayout。但是当滚动时AppBarLayout无法刷新,因为AppBarLayout尚未将滚动事件发送给父对象。因此,您可以尝试在仓库中使用RefreshBarLayout。

答案 1 :(得分:0)

您可以尝试像这样的视图层次结构

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/swipeRefreshLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingTop="?attr/actionBarSize">

        <android.support.v7.widget.RecyclerView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@+id/appBar"/>
    </android.support.v4.widget.SwipeRefreshLayout>

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"/>
    </android.support.design.widget.AppBarLayout>
</RelativeLayout>

在Java类中,您可以像这样使用SwipeRefreshLayout

swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipeRefreshLayout);
swipeRefreshLayout.setProgressViewOffset(false, 0, (int) (swipeRefreshLayout.getPaddingTop() * 1.5));
swipeRefreshLayout.setOnRefreshListener(() -> {
    swipeRefreshLayout.setRefreshing(true);
    // long process here
    new Handler().postDelayed(() -> runOnUiThread(() -> swipeRefreshLayout.setRefreshing(false)), 2000);
});

答案 2 :(得分:0)

编辑在AppBarLayout中添加了ProgressBar。

你需要像你说的那样用ReipeRefreshLayout包装ReyclerView,并将ProgressBar添加到自定义ToolBar中:

<强> activity_main.xml中

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="com.example.myapplication.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center">

                <TextView
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_gravity="start"
                    android:layout_weight="1"
                    android:gravity="start|center"
                    android:text="@string/app_name"
                    android:textColor="@android:color/white" />

                <ProgressBar
                    android:id="@+id/a_main_progress"
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:layout_marginEnd="10dp"
                    android:layout_marginRight="10dp"
                    android:visibility="invisible" />

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

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

    <android.support.v4.widget.SwipeRefreshLayout
        android:id="@+id/a_main_swipe"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <android.support.v7.widget.RecyclerView
            android:id="@+id/a_main_recycler"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

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

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

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

您还需要在MainActivity中设置监听器:

<强> MainActivity.java

public class MainActivity extends AppCompatActivity {

    private SwipeRefreshLayout swipeRefreshLayout;
    private ProgressBar progressBar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.a_main_swipe);
        progressBar = (ProgressBar) findViewById(R.id.a_main_progress);

        swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
            @Override
            public void onRefresh() {
                progressBar.setVisibility(View.VISIBLE);
                Handler handler = new Handler();
                handler.postDelayed(new Runnable() {
                    @Override
                    public void run() {
                        // Simulates a long running task (updating data)
                        swipeRefreshLayout.setRefreshing(false);
                        progressBar.setVisibility(View.INVISIBLE);
                    }
                }, 2000);
            }
        });

        MainAdapter mainAdapter = new MainAdapter(Arrays.asList("Hello", "World", "Bye"));
        RecyclerView recyclerView = (RecyclerView) findViewById(R.id.a_main_recycler);
        recyclerView.setAdapter(mainAdapter);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));
        recyclerView.addItemDecoration(new DividerItemDecoration(this, DividerItemDecoration.VERTICAL));
    }
}

如果你需要它,这是一个简单的适配器代码:

<强> MainAdapter.java

public class MainAdapter extends RecyclerView.Adapter<MainAdapter.ViewHolder> {

    private List<String> strings;

    public MainAdapter(List<String> strings) {
        this.strings = strings;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        LayoutInflater layoutInflater = LayoutInflater.from(parent.getContext());
        View view = layoutInflater.inflate(android.R.layout.simple_list_item_1, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        holder.bind(strings.get(position));
    }

    @Override
    public int getItemCount() {
        return strings != null ? strings.size() : 0;
    }

    public static class ViewHolder extends RecyclerView.ViewHolder {
        private final TextView textView;

        public ViewHolder(View itemView) {
            super(itemView);
            textView = (TextView) itemView.findViewById(android.R.id.text1);
        }

        public void bind(String s) {
            textView.setText(s);
        }
    }
}

这是更新的结果:

Result ProgressBar

答案 3 :(得分:0)

我终于以自己的方式解决了这个问题。 Here是录制简单用户界面的视频链接。

关键是我从github重写了appbarlayout-spring-behavior。这真的很有帮助。简单地说,我重写了AppBarLayoutSpringBehavior,在draging时添加了Pull-To-Refresh-Callback,并添加了一些逻辑来显示pull-to-refresh动画,以防止简单地动画回到原始状态。过了一段时间,然后我告诉行为动画回来。

虽然重写代码看起来很难看,但似乎可行。我将重构我的代码,使其干净和模块化