تصميم Custom BottomSheet وارسال بيانات الarray بداخله
في هذا المقال سوف نتعرف على كيفية إنشاء وعمل Custom BottomSheet في برنامج الاندرويد ستوديو بكل سهوله وببساطه حيث ان ال Custom BottomSheet من اكثر الاشياء التي عليها طلب كبير في التطبيقات وذلك لانه يعطي منظر مختلف في التطبيق ويحسن من المظهر العام الخاص بالتطبيق رغم سهوله انشاء وبساطته وفي مقال سابق شركنا لكم كيف تقوم بعمل Custom BottomSheet ايضا بالشكل الذي ترغب به ولكن في مقالة اليوم سوف نقوم بعمل listView بداخله واستخدام العناصر من داخله .
Android Studio هو IDE الرسمي لبرمجة Android ويأتي مع كل ما تحتاجه للبدء. يسمح لك ConstraintLayout بإنشاء تخطيطات معقدة عن طريق ربط القيود من طريقة عرض إلى طرق عرض وإرشادات أخرى. بعد ذلك ، من خلال تحديد أحد تكوينات الجهاز المتعددة أو ببساطة تغيير حجم نافذة المعاينة ، قد ترى التخطيط الخاص بك على أي حجم شاشة. محلل لملفات APK افحص محتويات ملف APK للتطبيق الخاص بك لمعرفة طرق تقليل حجم تطبيق Android ، حتى لو لم يتم إنشاؤه باستخدام Android Studio. افحص ملف البيان ، بالإضافة إلى الموارد وملفات DEX. قارن بين ملفي APK لملاحظة كيفية تطور حجم التطبيق بمرور الوقت.
إنشاء تصميم للCustom BottomSheet في الاندرويد
سوف تقوم بعمل عدد 2 layout واحده تحتوي على تصميم الbottom والاخر سوف تكون لعمل recycler لكي يتم تكرار العناصر بداخله وهذا ما نسعى له .
انشاء DataModel لتغيير البيانات
هنا سوف تقوم بعمل DataModel تحتوي على البيانات التي سوف نقوم بتمريرها الى ملف الdataModel لتغير البيانات .
DataModel.java
public class DataTest2 {
String name;
public DataTest2(String name) {
this.name = name;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
تهيئة ملف Adapter
في هذه المرحلة سوف نقوم بتهيئة ملف للadapter لكي نقوم بتمرير بيانات الrecycler بداخله .
Adapter.java
public class AdapterTest2 extends RecyclerView.Adapter<AdapterTest2.Holder> {
List<DataTest2> list;
ClickSurah clickSurah;
public AdapterTest2(List<DataTest2> list, ClickSurah clickSurah) {
this.list = list;
this.clickSurah = clickSurah;
}
@NonNull
@Override
public Holder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
return new Holder(DataBindingUtil.inflate(LayoutInflater.from(parent.getContext()) , R.layout.list_prayer , parent , false));
}
@Override
public void onBindViewHolder(@NonNull Holder holder, @SuppressLint("RecyclerView") int position) {
holder.binding.tv.setText(list.get(position).getName());
holder.itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
clickSurah.click(position);
}
});
}
@Override
public int getItemCount() {
return list.size();
}
public class Holder extends RecyclerView.ViewHolder {
ListPrayerBinding binding;
public Holder(@NonNull ListPrayerBinding binding) {
super(binding.getRoot());
this.binding = binding;
}
}
}
امكانية الضغط على العنصر من داخل الrecyclerView
سوف نقوم بعمل interface لكي يساعدك على الضغط على العنصر .
Click.Interface
public interface ClickSurah {
void click(int position);
}
إنشاء class مخصص للBottomSheet
في هذه المرحلة سوف نقوم بعمل كلاس مخصص لاستخدام الBottomSheet وسوف يكون محتوي على التصميم الذي قمنا به بالاعلى وايضا سوف يتم كتابة المتغيرات بداخله وتعريفها واستخدامها .
BottomSheet.class
public class BottomSheet extends BottomSheetDialogFragment {
List<DataTest2> list;
ClickSurah clickSurah;
public BottomSheet(List<DataTest2> list, ClickSurah clickSurah) {
this.list = list;
this.clickSurah = clickSurah;
}
@NonNull
@Override
public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {
BottomSheetDialog bottomSheetDialog = (BottomSheetDialog) super.onCreateDialog(savedInstanceState);
View view = LayoutInflater.from(getContext()).inflate(R.layout.layout_bottom_sheet , null);
bottomSheetDialog.setContentView(view);
RecyclerView recyclerView = view.findViewById(R.id.recycler_bottom_sheet);
recyclerView.setLayoutManager(new LinearLayoutManager(getContext()));
AdapterTest2 adapterPrayer = new AdapterTest2(list ,new ClickSurah() {
@Override
public void click(int position) {
clickSurah.click(position);
}
});
recyclerView.setAdapter(adapterPrayer);
RecyclerView.ItemDecoration itemDecoration = new DividerItemDecoration(getContext() , DividerItemDecoration.VERTICAL);
recyclerView.addItemDecoration(itemDecoration);
return bottomSheetDialog;
}
استدعاء الCustom BottomSheet من الMainActivity
سوف نقوم هنا بعمل List من البيانات وارسالها الى الكلاس السابق الذي يحمل منا الlist وايضا سوف نرسل له الcontext واخيرا سوف نقوم بإستدعاء الdialog .
MainActivity.class
public class PrayerActivity extends AppCompatActivity implements ClickSurah {
ActivityPrayerBinding binding;
List<DataTest2> list2;
BottomSheet bottomSheet;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding= DataBindingUtil.setContentView(this,R.layout.activity_prayer);
binding.btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
bottom_();
}
});
}
private void bottom_ () {
list2 = new ArrayList<>();
list2.add(new DataTest2("ahmed"));
list2.add(new DataTest2("mohamed"));
list2.add(new DataTest2("khaled"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
list2.add(new DataTest2("hamed"));
bottomSheet = new BottomSheet(list2, this);
bottomSheet.show(getSupportFragmentManager() , bottomSheet.getTag());
}
@Override
public void click(int position) {
Toast.makeText(this, list2.get(position).getName(), Toast.LENGTH_SHORT).show();
bottomSheet.dismiss();
}
}
