web-dev-qa-db-ja.com

Android GridLayoutと行あたりの動的な列数

幅の異なるカードがあり、幅=親(画面全体)と固定の高さに一致するグリッドレイアウトを作成したいと思います。グリッドレイアウトでカードを設定し、行に収まる要素の幅に応じて列数が変化するようにします。

そのため、要素は画面に収まるまで水平方向の行に設定され、固定の高さを超えると垂直方向にスクロールして次の行に移動します。

グリッドレイアウトを使用しようとしていますが、これに適したソリューションかどうかわかりません。私はネイティブAndroidを使用しています。

ここにそれの写真は次のように見えるはずです:

enter image description here

ありがとう。

6
Antonio Mele

FlexboxLayoutManager を使用できます

Build.gradleファイルに次の依存関係を追加します。

implementation 'com.google.Android:flexbox:0.3.2'

サンプルコード

LAYOUT.XML

<LinearLayout 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:orientation="vertical"
    tools:context=".MainActivity">

    <Android.support.v7.widget.RecyclerView
      Android:id="@+id/recyclerView"
      Android:layout_width="match_parent"
      Android:layout_height="250dp" />



</LinearLayout>

アクティビティコード

import Android.os.Bundle;
import Android.support.v7.app.AppCompatActivity;
import Android.support.v7.widget.RecyclerView;

import com.google.Android.flexbox.FlexDirection;
import com.google.Android.flexbox.FlexboxLayoutManager;
import com.google.Android.flexbox.JustifyContent;

import Java.util.ArrayList;


public class MainActivity extends AppCompatActivity {

    RecyclerView recyclerView;
    ArrayList<String> arrayList = new ArrayList<>();
    DataAdapter adapter;

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

        recyclerView = findViewById(R.id.recyclerView);
        initArray();
        FlexboxLayoutManager layoutManager = new FlexboxLayoutManager(this);
        layoutManager.setFlexDirection(FlexDirection.COLUMN);
        layoutManager.setJustifyContent(JustifyContent.FLEX_END);
        recyclerView.setLayoutManager(layoutManager);
        adapter = new DataAdapter(this, arrayList);
        recyclerView.setAdapter(adapter);

    }

    private void initArray() {

        arrayList.add("ioreeoe");
        arrayList.add("fghfgh");
        arrayList.add("ftyjyjhghgh");
        arrayList.add("jfgewrg");
        arrayList.add("rwrewr");
        arrayList.add("ghyjtyfghh");
        arrayList.add("gfhfgh");
        arrayList.add("gfhfht");
        arrayList.add("retretret");
        arrayList.add("retret");
        arrayList.add("ioreeoe");
        arrayList.add("fghfgh");
        arrayList.add("ftyjyjhghgh");
        arrayList.add("jfgewrg");
        arrayList.add("rwrewr");
        arrayList.add("ghyjtyfghh");
        arrayList.add("gfhfgh");
        arrayList.add("gfhfht");
        arrayList.add("retretret");
        arrayList.add("retret");
        arrayList.add("ioreeoe");
        arrayList.add("fghfgh");
        arrayList.add("ftyjyjhghgh");
        arrayList.add("jfgewrg");
        arrayList.add("rwrewr");
        arrayList.add("ghyjtyfghh");
        arrayList.add("gfhfgh");
        arrayList.add("gfhfht");
        arrayList.add("retretret");
        arrayList.add("retret");
    }

}

アダプターコード

import Android.content.Context;
import Android.support.v7.widget.RecyclerView;
import Android.view.LayoutInflater;
import Android.view.View;
import Android.view.ViewGroup;
import Android.widget.TextView;

import Java.util.ArrayList;

/**
 * Created by nilesh on 3/4/18.
 */

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

    Context context;
    ArrayList<String> arrayList = new ArrayList<>();

    public DataAdapter(Context context, ArrayList<String> arrayList) {
        this.context = context;
        this.arrayList = arrayList;
    }

    @Override
    public DataAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(context).inflate(R.layout.custom_layout, parent, false);
        return new ViewHolder(view);
    }

    @Override
    public void onBindViewHolder(DataAdapter.ViewHolder holder, int position) {

        holder.title.setText(arrayList.get(position));
    }

    @Override
    public int getItemCount() {
        return arrayList.size();
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        TextView title;

        public ViewHolder(View itemView) {
            super(itemView);
            title = itemView.findViewById(R.id.nilu);
        }
    }
}

custom_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="wrap_content"
    Android:layout_height="wrap_content">

    <TextView
        Android:id="@+id/nilu"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_margin="5dp"
        Android:background="@drawable/test"
        Android:padding="10dp"
        Android:textColor="#050505" />
</LinearLayout>

@ drawable/test

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
    <item>
        <shape Android:shape="rectangle"  >
            <corners Android:radius="30dp"/>
            <solid Android:color="#d10e0e"/>
            <stroke Android:width="1dip" Android:color="#070fe9" />
        </shape>
    </item>
</selector>

[〜#〜]結果[〜#〜]

![enter image description here

10
Nilesh Rathod

StaggeredGridViewライブラリを使用できます。例えば。 https://github.com/etsy/AndroidStaggeredGrid編集:build.gradleとxmlに依存関係を追加できます追加:

 <com.etsy.Android.grid.StaggeredGridView

        Android:id="@+id/itemgridfragment_gridview"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        app:column_count="2"
        Android:background="@color/white"
        app:item_margin="@dimen/fragment_landingpage_8" />

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