幅の異なるカードがあり、幅=親(画面全体)と固定の高さに一致するグリッドレイアウトを作成したいと思います。グリッドレイアウトでカードを設定し、行に収まる要素の幅に応じて列数が変化するようにします。
そのため、要素は画面に収まるまで水平方向の行に設定され、固定の高さを超えると垂直方向にスクロールして次の行に移動します。
グリッドレイアウトを使用しようとしていますが、これに適したソリューションかどうかわかりません。私はネイティブAndroidを使用しています。
ここにそれの写真は次のように見えるはずです:
ありがとう。
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>
[〜#〜]結果[〜#〜]
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>