Reputation: 2340
I'm creating an Android app that shows a simple skin color picker using a custom Dialog
and a (horizontal) Recycler View
.
But when I show the Dialog
(by clicking an Edit Text
), the Dialog
appeared but the Recycler View
didn't like this image below. The Dialog
only showed the Button
.
Did I miss something in my codes? Maybe in the Recycler View Adapter
.
Here are the codes:
arrays.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string-array name="skinColors">
<item>#f26ab8</item>
<item>#531216</item>
<item>#ee8c5c</item>
<item>#8b1929</item>
<item>#f5a20f</item>
<item>#2b6c99</item>
<item>#73def6</item>
<item>#f89e0a</item>
<item>#6e938a</item>
<item>#132855</item>
</string-array>
</resources>
item_card_view_color.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="150dp"
android:layout_height="150dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardCornerRadius="10dp"
android:layout_margin="10dp"
android:id="@+id/cardViewColor">
</androidx.cardview.widget.CardView>
dialog_color_list_picker.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:background="@color/white">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerViewColorList"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
app:layout_constraintBottom_toTopOf="@+id/buttonPilih"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:listitem="@layout/item_card_view_color"
android:layout_marginBottom="10dp"/>
<Button
android:id="@+id/buttonPilih"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_margin="10dp"
android:text="@string/pilih"
android:textAllCaps="false"/>
</androidx.constraintlayout.widget.ConstraintLayout>
SkinColorHelper.java
public class SkinColorHelper {
public static List<Integer> getSkinColorList(Context context) {
String[] skinColorList = context.getResources().getStringArray(R.array.skinColors);
List<Integer> output = new ArrayList<>();
for(int i = 0; i < skinColorList.length; i++) {
int color = Color.parseColor(skinColorList[i]);
output.add(color);
}
return output;
}
}
SkinColorPickerAdapter.java
public class SkinColorPickerAdapter extends RecyclerView.Adapter<SkinColorPickerAdapter.CardViewHolder> {
private List<Integer> skinColorList = new ArrayList<>();
public SkinColorPickerAdapter() {
}
void setSkinColorList(List<Integer> skinColorList) {
this.skinColorList = skinColorList;
}
@NonNull
@Override
public CardViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
ItemCardViewColorBinding binding = ItemCardViewColorBinding.inflate(LayoutInflater.from(parent.getContext()), parent, false);
return new CardViewHolder(binding);
}
@Override
public void onBindViewHolder(@NonNull SkinColorPickerAdapter.CardViewHolder holder, int position) {
int color = skinColorList.get(position);
holder.bind(color);
}
@Override
public int getItemCount() {
return skinColorList.size();
}
public class CardViewHolder extends RecyclerView.ViewHolder{
private ItemCardViewColorBinding binding;
public CardViewHolder(ItemCardViewColorBinding binding) {
super(binding.getRoot());
this.binding = binding;
}
void bind(int color) {
binding.cardViewColor.setBackgroundColor(color);
}
}
}
activity_input_measurement.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".ui.patient.inputmeasurement.InputMeasurementActivity">
<LinearLayout
android:id="@+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_marginHorizontal="50dp">
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.material.textfield.TextInputEditText
android:id="@+id/editTextWarnaKulitJari"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="false"
android:cursorVisible="false"
android:drawableStart="@drawable/ic_baseline_circle_24"
android:drawablePadding="10dp"
android:gravity="center_vertical"
android:hint="skin color picker"
android:inputType="text"
android:textColor="@color/black"
android:textColorHint="@color/black"
android:textSize="14sp" />
</com.google.android.material.textfield.TextInputLayout>
</LinearLayout>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/buttonSimpan"
android:text="@string/simpan"
android:textAllCaps="false"
android:textSize="14sp"
android:layout_margin="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
</androidx.constraintlayout.widget.ConstraintLayout>
InputMeasurementActivity.java
public class InputMeasurementActivity extends AppCompatActivity implements View.OnClickListener {
// GENERAL
ActivityInputMeasurementBinding binding;
String TAG = getClass().getSimpleName();
ArrayList<HashMap<String, Object>> patientList = new ArrayList<>();
Dialog dialog;
DialogColorListPickerBinding dialogBinding;
// KEYS FOR PATIENT DATA
String keyPatientId = "id";
String keyPatientName = "name";
String keyPatientGender = "gender";
String keyPatientNik = "nik";
String keyPatientBirthDate = "birthDate";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = ActivityInputMeasurementBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
dialog = new Dialog(this);
dialogBinding = DialogColorListPickerBinding.inflate(getLayoutInflater());
initializeColorListPickerDialog();
hideProgressBar();
binding.editTextWarnaKulitJari.setOnClickListener(this);
}
// ON CLICK LISTENER
@Override
public void onClick(View v) {
if(v.getId() == R.id.editTextWarnaKulitJari) {
dialog.show();
}
}
private void showProgressBar() {
binding.linearLayout.setVisibility(View.GONE);
binding.progressBar.setVisibility(View.VISIBLE);
}
private void hideProgressBar() {
binding.linearLayout.setVisibility(View.VISIBLE);
binding.progressBar.setVisibility(View.GONE);
}
private void addDataToSkinColorRecylcerView() {
List<Integer> colorList = SkinColorHelper.getSkinColorList(this);
Log.d(TAG, "colorListSize: " + colorList.size() + " colorList: " + colorList.toString());
SkinColorPickerAdapter adapter = new SkinColorPickerAdapter();
adapter.setSkinColorList(colorList);
adapter.notifyDataSetChanged();
LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);
dialogBinding.recyclerViewColorList.setLayoutManager(layoutManager);
dialogBinding.recyclerViewColorList.setHasFixedSize(true);
dialogBinding.recyclerViewColorList.setAdapter(adapter);
}
private void initializeColorListPickerDialog() {
addDataToSkinColorRecylcerView();
dialog.setContentView(R.layout.dialog_color_list_picker);
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
}
}
Upvotes: 0
Views: 850
Reputation: 3673
UPDATE
I saw that your adapter was set up totally wrong. I think you got confused at the end of the closely same names in your app. But the good news are, that I fixed that for you. Here is your SkinColorPickerAdapter.class
:
public class SkinColorPickerAdapter extends RecyclerView.Adapter<SkinColorPickerAdapter.CardViewHolder> {
private List<Integer> skinColorList = new ArrayList<>();
public SkinColorPickerAdapter() {
}
@NonNull
@Override
public SkinColorPickerAdapter.CardViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_card_view_color,parent,false);
return new SkinColorPickerAdapter.CardViewHolder(view);
}
@Override
public void onBindViewHolder(@NonNull SkinColorPickerAdapter.CardViewHolder holder, int position) {
int color = skinColorList.get(position);
holder.cardView.setCardBackgroundColor(color);
}
@Override
public int getItemCount() {
return skinColorList.size();
}
public void setSkinColorList(List<Integer> skinColorList) {
this.skinColorList = skinColorList;
notifyDataSetChanged();
}
public class CardViewHolder extends RecyclerView.ViewHolder{
private CardView cardView;
public CardViewHolder(View view) {
super(view);
this.cardView = view.findViewById(R.id.cardViewColor);
}
}
}
And here your InputMeasurementActivity.class:
public class InputMeasurementActivity extends AppCompatActivity implements View.OnClickListener {
// GENERAL
ActivityInputMeasurementBinding binding;
String TAG = getClass().getSimpleName();
ArrayList<HashMap<String, Object>> patientList = new ArrayList<>();
AlertDialog dialog;
AlertDialog.Builder dialogBuilder;
// KEYS FOR PATIENT DATA
String keyPatientId = "id";
String keyPatientName = "name";
String keyPatientGender = "gender";
String keyPatientNik = "nik";
String keyPatientBirthDate = "birthDate";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = ActivityInputMeasurementBinding.inflate(getLayoutInflater());
setContentView(binding.getRoot());
hideProgressBar();
binding.editTextWarnaKulitJari.setOnClickListener(this);
}
// ON CLICK LISTENER
@Override
public void onClick(View v) {
if(v.getId() == R.id.editTextWarnaKulitJari) {
initializeColorListPickerDialog();
}
}
private void showProgressBar() {
binding.linearLayout.setVisibility(View.GONE);
binding.progressBar.setVisibility(View.VISIBLE);
}
private void hideProgressBar() {
binding.linearLayout.setVisibility(View.VISIBLE);
binding.progressBar.setVisibility(View.GONE);
}
private void initializeColorListPickerDialog() {
List<Integer> colorList = SkinColorHelper.getSkinColorList(this);
SkinColorPickerAdapter adapter = new SkinColorPickerAdapter();
adapter.setSkinColorList(colorList);
dialogBuilder = new AlertDialog.Builder(this);
View view = getLayoutInflater().inflate(R.layout.dialog_color_list_picker,null);
view.setClipToOutline(true);
dialogBuilder.setView(view);
RecyclerView recyclerView = view.findViewById(R.id.recyclerViewColorList);
recyclerView.setLayoutManager(new LinearLayoutManager(getApplicationContext()));
recyclerView.setHasFixedSize(true);
SkinColorPickerAdapter skinColorPickerAdapter = new SkinColorPickerAdapter();
skinColorPickerAdapter.setSkinColorList(colorList);
recyclerView.setAdapter(skinColorPickerAdapter);
dialog = dialogBuilder.create();
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
dialog.show();
}
}
And I changed the size of your recyclerView
in your dialog_color_list_picker.xml
:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:background="@color/white">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recyclerViewColorList"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
app:layout_constraintBottom_toTopOf="@+id/buttonPilih"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
tools:listitem="@layout/item_card_view_color"
android:layout_marginBottom="10dp"/>
<Button
android:id="@+id/buttonPilih"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:layout_margin="10dp"
android:text="@string/pilih"
android:textAllCaps="false"/>
</androidx.constraintlayout.widget.ConstraintLayout>
FINAL RESULT
Upvotes: 1