Advanced UI Components (Time and date, List View, Grid View, Card View, Recycler view) in Hindi

Android में Advanced UI Components user experience को बेहतर बनाने के लिए उपयोग किए जाते हैं। यहाँ हम Time and Date Pickers, ListView, GridView, CardView और RecyclerView को विस्तार से समझेंगे।

1. Time and Date Pickers

TimePicker और DatePicker का उपयोग user से time और date input लेने के लिए किया जाता है। ये दो प्रकार के होते हैं:

• Spinner Mode (Traditional UI)
• Calendar Mode (Material UI)

(a) DatePicker

यह user को date चुनने की सुविधा देता है।

Implementation:

java

DatePickerDialog datePickerDialog = new DatePickerDialog(this, (view, year, month, dayOfMonth) -> {
    String selectedDate = dayOfMonth + "/" + (month + 1) + "/" + year;
    textView.setText(selectedDate);
}, year, month, day);
datePickerDialog.show();

(b) TimePicker

यह user को time चुनने की सुविधा देता है।

Implementation:

java

TimePickerDialog timePickerDialog = new TimePickerDialog(this, (view, hourOfDay, minute) -> {
    String selectedTime = hourOfDay + ":" + minute;
    textView.setText(selectedTime);
}, hour, minute, false);
timePickerDialog.show();

2. ListView

ListView का उपयोग Scrollable List बनाने के लिए किया जाता है। यह Simple और Custom Layouts को support करता है।

Implementation of ListView:

Step 1: XML Layout

xml

<ListView
    android:id="@+id/listView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Step 2: Java Code

java

String[] items = {"Item 1", "Item 2", "Item 3", "Item 4"};
ArrayAdapter<String> adapter = new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, items);
ListView listView = findViewById(R.id.listView);
listView.setAdapter(adapter);

3. GridView

GridView का उपयोग 2D Scrollable Grid Layout बनाने के लिए किया जाता है, जैसे कि Gallery या Image List।

Implementation of GridView:

Step 1: XML Layout

xml

<GridView
    android:id="@+id/gridView"
    android:numColumns="2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Step 2: Java Code

java

String[] items = {"A", "B", "C", "D", "E", "F"};
ArrayAdapter adapter = new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, items);
GridView gridView = findViewById(R.id.gridView);
gridView.setAdapter(adapter);

4. CardView (Material UI)

CardView का उपयोग content को एक सुंदर card style में दिखाने के लिए किया जाता है।

Implementation of CardView:

Step 1: Add Dependency (build.gradle)

gradle

implementation 'androidx.cardview:cardview:1.0.0'

Step 2: XML Layout

xml

<androidx.cardview.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardCornerRadius="8dp"
    app:cardElevation="4dp">
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Card View Example"/>
</androidx.cardview.widget.CardView>

5. RecyclerView (Advanced List & Grid)

RecyclerView को ListView और GridView के updated version के रूप में जाना जाता है। यह Memories Optimize करता है और बहुत ज्यादा data के साथ भी smooth काम करता है।

Implementation of RecyclerView:

Step 1: Add Dependency (build.gradle)

gradle

implementation 'androidx.recyclerview:recyclerview:1.2.1'

Step 2: XML Layout

xml

<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"/>

Step 3: Create RecyclerView Adapter

java

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.MyViewHolder> {
    private String[] data;
    
    public MyAdapter(String[] data) {
        this.data = data;
    }
    
    @NonNull
    @Override
    public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(android.R.layout.simple_list_item_1, parent, false);
        return new MyViewHolder(view);
    }
    
    @Override
    public void onBindViewHolder(@NonNull MyViewHolder holder, int position) {
        holder.textView.setText(data[position]);
    }
    
    @Override
    public int getItemCount() {
        return data.length;
    }
    
    static class MyViewHolder extends RecyclerView.ViewHolder {
        TextView textView;
        
        public MyViewHolder(@NonNull View itemView) {
            super(itemView);
            textView = itemView.findViewById(android.R.id.text1);
        }
    }
}

Adptors (Base, Array) & View Holder

Development of Android Applications Notes in Hindi

Follow Us

   

• Introduction to Android in Hindi


• Dalvik Vartual Machine in Hindi


• Basic Building Blocks in Android in Hindi


• Fundamentals of android in Hindi


• apk file extension in Hindi


• UI components in Hindi

• Components for communication in Android in Hindi


• Android API Levels in Hindi


• Setting up development environment in Hindi


• Manifest.xml in Hindi


• Resources & R.java in Hindi