web-dev-qa-db-ja.com

SwipeRefreshLayoutの使用方法は?

バックグラウンド

Googleは最近、 サポートライブラリ のアップデートを公開しました。このライブラリには、新しい「 SwipeRefreshLayout "ビュー。

このビューでは、リフレッシュ操作を実行するために下にスワイプすることをサポートしながら、別のビューをラップできます。

スクリーンショット:

enter image description here

問題

Googleはサンプルを提供していません(少なくとも私が見つけることができるものはまだありません)ので、自分で試してみました。

最初はスワイプするたびにクラッシュ(NPE)が発生しましたが、「OnRefreshListener」を提供しなかったためだとわかりました。

しかし、私はまだそれを使用する方法を取得していない、それをカスタマイズすることは言うまでもない

レイアウトファイルのXMLは次のとおりです。

<Android.support.v4.widget.SwipeRefreshLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:id="@+id/container"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    tools:context="com.example.swiperefreshlayouttest.MainActivity"
    tools:ignore="MergeRootFrame" >

    <ScrollView
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content" >

        <LinearLayout
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:orientation="vertical" >

            <TextView
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:text="TTT"
                Android:textSize="40sp" />

            <TextView
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:text="TTT"
                Android:textSize="40sp" />

            <TextView
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:text="TTT"
                Android:textSize="40sp" />

            <TextView
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:text="TTT"
                Android:textSize="40sp" />

            <TextView
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:text="TTT"
                Android:textSize="40sp" />
        </LinearLayout>
    </ScrollView>

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

コードは、まったく特別なことはしませんが:

public class MainActivity extends ActionBarActivity
  {
  @Override
  protected void onCreate(final Bundle savedInstanceState)
    {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    final SwipeRefreshLayout swipeRefreshLayout=(SwipeRefreshLayout)findViewById(R.id.container);
    swipeRefreshLayout.setOnRefreshListener(new OnRefreshListener()
      {
        @Override
        public void onRefresh()
          {
          // do nothing
          }
      });
    }
  }

質問

このビューを使用する正しい方法は何ですか?

どうすればカスタマイズできますか?現在、それはただの黒い線です...

18

あなたが拡張しているそのActionBarActivityクラスはダンノですが、私はFragmentActivityを使用してうまく動作させました

_public class ActivityMain extends FragmentActivity implements OnRefreshListener {

    private SwipeRefreshLayout mSwipeRefreshLayout;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        setContentView(R.layout.activity_main);
        mSwipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.container);
        mSwipeRefreshLayout.setOnRefreshListener(this);

        super.onCreate(savedInstanceState);
    }

    @Override
    public void onRefresh() {
        Toast.makeText(this, "Refresh", Toast.LENGTH_SHORT).show();
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                mSwipeRefreshLayout.setRefreshing(false);
            }
        }, 2000);
    }
}
_

指摘する価値があるxmlレイアウトをそのままコピーします

カスタマイズに関しては、setColorScheme(int colorResId、int colorResId、int colorResId、int colorResId);を呼び出して、色付きバーの色を変更する以外にできることはほとんどありません。

例えば.

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

    <color name="blue">#0099CC</color>
    <color name="purple">#9933CC</color>
    <color name="green">#669900</color>
    <color name="orange">#FF8800</color>

</resources>
_

mSwipeRefreshLayout.setColorScheme(R.color.blue, R.color.purple, R.color.green, R.color.orange);

それは本当に残念な追加です。リフレッシュの感度はかなり高く、変更する設定はありません

編集

このクラス(およびActionBarActivityクラス)がSDKに追加されたときにこれを書きました。そのため、この回答を書いたときからいくつかの点が変わっています。さらに、使用するアクティビティの種類がこのソリューションに影響することはありません。

setColorSchemeは非推奨になりました。代わりにsetColorSchemeResources(int... colorResIds)を使用する必要があります。 (好きなだけ色IDをそこに入れることができます)。

setDistanceToTriggerSync(int distance)は、更新をトリガーするためにユーザーがスワイプする必要がある範囲を設定するためにも使用できます。

公式ドキュメント をチェックして、クラスが提供する他の機能を確認することをお勧めします。

35
rperryng

MainActivity.Java

public class MainActivity extends ActionBarActivity {
    TextView textView;
    private SwipeRefreshLayout mSwipeRefreshLayout;
    static int count = 0;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    textView = (TextView) findViewById(R.id.scrollTextView);

    // /You will setup the action bar with pull to refresh layout
    mSwipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.container);

     mSwipeRefreshLayout.setColorScheme(R.color.blue,
     R.color.green, R.color.orange, R.color.purple);
    mSwipeRefreshLayout.setOnRefreshListener(new OnRefreshListener() {
        @Override
        public void onRefresh() {
            Log.e(getClass().getSimpleName(), "refresh");
            new GetLinks().execute();
        }
    });
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {

    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();
    if (id == R.id.action_settings) {
        return true;
    }
    return super.onOptionsItemSelected(item);
}

public class GetLinks extends AsyncTask<Void, Void, Void> {
    @Override
    protected void onPreExecute() {
        super.onPreExecute();

    }

    @Override
    protected Void doInBackground(Void... params) {

        try {
            Thread.sleep(5000);
        } catch (InterruptedException e) {

            e.printStackTrace();

        }
        return null;
    }

    @Override
    protected void onPostExecute(Void result) {
        super.onPostExecute(result);
         //Here you can update the view
        textView.setText(textView.getText().toString()+"--New Content Added" + ++count);

        // Notify swipeRefreshLayout that the refresh has finished
        mSwipeRefreshLayout.setRefreshing(false);
    }

}

}

activity_main.xml

<Android.support.v4.widget.SwipeRefreshLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:tools="http://schemas.Android.com/tools"
    Android:id="@+id/container"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent" >

    <ScrollView
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content" >
            <TextView
                Android:layout_width="match_parent"
                Android:layout_height="wrap_content"
                Android:id="@+id/scrollTextView"
                Android:text="TTT"
                Android:textSize="40sp" />
    </ScrollView>

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

colors.xml

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

    <item name="blue" type="color">#FF33B5E5</item>
    <item name="purple" type="color">#FFAA66CC</item>
    <item name="green" type="color">#FF99CC00</item>
    <item name="orange" type="color">#FFFFBB33</item>

</resources>
11
Zohra Khan

例については、以下を参照してください。 http://developer.Android.com/samples/SwipeRefreshLayoutBasic/index.html

6
Simon

以下の方法に従うだけでできます(Expandable listでswipelayoutを使用しています)Test.xml

_  <Android.support.v4.widget.SwipeRefreshLayout
        Android:id="@+id/swipe2"
        Android:layout_width="fill_parent"
        Android:layout_height="fill_parent"
        Android:layout_below="@id/RelativeTop"
        Android:background="@drawable/listbg" >

        <ExpandableListView
            Android:id="@+id/lvExp"
            Android:layout_width="fill_parent"
            Android:layout_height="fill_parent"
            Android:cacheColorHint="@Android:color/transparent"
            Android:groupIndicator="@null"
            Android:listSelector="@Android:color/white" />
    </Android.support.v4.widget.SwipeRefreshLayout>
_

ListHeader.xml

_    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
         Android:layout_width="fill_parent"
         Android:layout_height="wrap_content"
         Android:background="@drawable/sectionbg"
         Android:orientation="horizontal"
         Android:padding="8dp" >

<ImageView
    Android:id="@+id/imageView1"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_gravity="center_vertical"
    Android:contentDescription="@string/contentdescription"
    Android:src="@drawable/expandbtn" />

<TextView
    Android:id="@+id/lblListHeader"
    Android:layout_width="fill_parent"
    Android:layout_height="wrap_content"
    Android:layout_gravity="center_vertical"
    Android:layout_marginLeft="3dp"
    Android:text="this is test"
    Android:textColor="@Android:color/white"
    Android:textSize="17sp" />
_

ChildItem.xml

_<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:layout_width="fill_parent"
Android:layout_height="55dp"
Android:background="@color/GrayProductBackground" >

<TextView
    Android:id="@+id/lblListItem"
    Android:layout_width="match_parent"
    Android:layout_height="50dp"
    Android:layout_marginLeft="35dp"
    Android:layout_marginRight="20dp"
    Android:gravity="center_vertical"
    Android:paddingBottom="5dp"
    Android:textColor="@color/GrayTextProduct"
    Android:textSize="17sp" />

<ImageView
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content"
    Android:layout_alignParentRight="true"
    Android:layout_alignRight="@+id/lblListItem"
    Android:layout_centerVertical="true"
    Android:layout_marginLeft="10dp"
    Android:layout_marginRight="10dp"
    Android:contentDescription="@string/arrowdescription"
    Android:gravity="center"
    Android:src="@drawable/navigationarrow" />

<RelativeLayout
    Android:layout_width="fill_parent"
    Android:layout_height="1dp"
    Android:layout_alignParentBottom="true"
    Android:background="@Android:color/white" >
</RelativeLayout>
_

使用色

_<color name="pDarkGreen">#8ec549</color>
<color name="pDarskSlowGreen">#c1f57f</color>
<color name="pLightGreen">#f7ffed</color>
<color name="pFullLightGreen">#d6d4d4</color>
_

Mainactivity.Java

_        swipeView = (SwipeRefreshLayout) findViewById(R.id.swipe2);
        swipeView.setColorSchemeResources(R.color.pDarkGreen, R.color.Gray, R.color.Yellow, R.color.pFullLightGreen);

swipeView.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
                @Override
                public void onRefresh() {

                        swipeView.setRefreshing(false);

                    }
                    (new Handler()).postDelayed(new Runnable() {
                        @Override
                        public void run() {

                            Log.d("Swipe", "Refreshing Number");

                        }
                    }, 0);
                }
            });
_

swipeView.setRefreshing(false);を要求に応じてfalseまたはtrueに設定できます。このスワイプメカニズムは、AndroidのすべてのAPIレベルで動作します

1
Kirtikumar A.

activity_main.xml

 <Android.support.v4.widget.SwipeRefreshLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:id="@+id/swipe_refresh_layout"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content">

<Android.support.v4.view.ViewPager
    Android:id="@+id/viewpager"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    Android:visibility="gone"/>

MainActivity.Java

public class MainActivity extends AppCompatActivity
    implements SwipeRefreshLayout.OnRefreshListener {

      static ViewPager viewPager;

     @Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipe_refresh_layout);
    viewPager = (ViewPager) findViewById(R.id.viewpager);
    swipeRefreshLayout.setOnRefreshListener(this);
    swipeRefreshLayout.post(new Runnable() {
                                @Override
                                public void run() {
                                    swipeRefreshLayout.setRefreshing(true);
                                    setupViewPager(viewPager);
                                }
                            }
    );
}



 private void setupViewPager(ViewPager viewPager) {


swipeRefreshLayout.setRefreshing(false);


 }


} 
0
Hanisha

Kotlinを使用したSwipeRefreshLayout

XMLファイルコード

 <androidx.swiperefreshlayout.widget.SwipeRefreshLayout
        Android:layout_width="0dp"
        Android:layout_height="0dp" app:layout_constraintTop_toTopOf="parent"
        Android:layout_marginTop="90dp" app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        Android:layout_marginBottom="93dp" app:layout_constraintEnd_toEndOf="parent"
        Android:id="@+id/swipe_refresh_layout"
>
    <androidx.recyclerview.widget.RecyclerView
            Android:layout_width="0dp"
            Android:layout_height="0dp" app:layout_constraintTop_toTopOf="parent"
            Android:layout_marginTop="90dp" app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            Android:layout_marginBottom="93dp" app:layout_constraintEnd_toEndOf="parent"
            Android:id="@+id/recyclerView"
    />
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>

アクティビティコード

Oncreateメソッドの上に次のコードを宣言します

    var mSwipeRefreshLayout: SwipeRefreshLayout? = null

SetContentView行の後にoncreateメソッド内で次のコードを宣言します

mSwipeRefreshLayout= findViewById<SwipeRefreshLayout>(R.id.swipe_refresh_layout)
mSwipeRefreshLayout!!.setOnRefreshListener {
   //API Calls
}

成功したAPI呼び出しまたは失敗したAPI呼び出し

                mSwipeRefreshLayout!!.isRefreshing = false
0
Amol Pokale