¿Cómo agregar Custom Spinner en Android?

Spinner es un widget que se utiliza para seleccionar un elemento de una lista de elementos. Cuando el usuario toca una rueda giratoria, un menú desplegable es visible para el usuario. En este artículo, aprenderemos cómo agregar un girador personalizado en la aplicación. Si desea saber más sobre spinner en detalle, haga clic en este enlace .

Acercarse:

Cree un nuevo archivo algoritmo_spinner.xml y agregue el siguiente código. Cada elemento de la ruleta tendrá este diseño, una vista de imagen y una vista de texto .

algoritmo_spinner.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  
    <ImageView
        android:id="@+id/image_view"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/gfg" />
  
    <TextView
        android:id="@+id/text_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/image_view"
        android:layout_alignParentTop="true"
        android:layout_margin="20dp"
        android:layout_toEndOf="@+id/image_view"
        android:gravity="center"
        android:text="Quick Sort"
        android:textColor="@android:color/black"
        android:textSize="20sp" />
  
</RelativeLayout>

Cree un nuevo archivo AlgorithmItem.java y agregue el siguiente código a continuación. Esta es la clase de modelo que se utiliza para obtener el nombre del algoritmo cuando el usuario hace clic en cualquier elemento. Aquí definimos un constructor y un método getAlgorithmName que devuelve el nombre del algoritmo del objeto.

AlgorithmItem.java

package org.geeksforgeeks.gfgcustomspinner;
  
public class AlgorithmItem {
    private String algorithmName;
  
    public AlgorithmItem(String countryName)
    {
        algorithmName = countryName;
    }
  
    public String getAlgorithmName()
    {
        return algorithmName;
    }
}

Cree un nuevo archivo AlgorithmAdapter.java y agregue el siguiente código. Aquí definimos nuestra propia clase Adapter . Mapea el elemento con su vista, proporcionando acceso a los datos del elemento en la lista de control giratorio.

AlgorithmAdapter.java

package org.geeksforgeeks.gfgcustomspinner;
  
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import java.util.ArrayList;
  
public class AlgorithmAdapter extends ArrayAdapter<AlgorithmItem> {
  
    public AlgorithmAdapter(Context context,
                            ArrayList<AlgorithmItem> algorithmList)
    {
        super(context, 0, algorithmList);
    }
  
    @NonNull
    @Override
    public View getView(int position, @Nullable
                                      View convertView, @NonNull ViewGroup parent)
    {
        return initView(position, convertView, parent);
    }
  
    @Override
    public View getDropDownView(int position, @Nullable
                                              View convertView, @NonNull ViewGroup parent)
    {
        return initView(position, convertView, parent);
    }
  
    private View initView(int position, View convertView,
                          ViewGroup parent)
    {
        // It is used to set our custom view.
        if (convertView == null) {
            convertView = LayoutInflater.from(getContext()).inflate(R.layout.algorithm_spinner, parent, false);
        }
  
        TextView textViewName = convertView.findViewById(R.id.text_view);
        AlgorithmItem currentItem = getItem(position);
  
        // It is used the name to the TextView when the
        // current item is not null.
        if (currentItem != null) {
            textViewName.setText(currentItem.getAlgorithmName());
        }
        return convertView;
    }
}

Agregue el siguiente código en el archivo activity_main.xml. Aquí agregamos nuestra ruleta en el diseño. Esto agregará una vista de texto y un control giratorio .

actividad_principal.xml

      
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    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"
    tools:context=".MainActivity">
  
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Learn Algorithms"
        android:textStyle="bold"
        android:textSize="18sp"
        android:layout_above="@+id/spinner_algorithm"
        android:layout_marginStart="10dp"
        android:layout_marginBottom="25dp"
        />
  
    <Spinner
        android:layout_margin="5dp"
        android:id="@+id/spinner_algorithm"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_marginTop="18dp" />
  
</RelativeLayout>

Ahora agregue el siguiente código en el archivo MainActivity.java . Aquí se crea el objeto de clase AlgorithmAdapter y actúa como un adaptador para el control giratorio y agrega onItemSelectedListner() a nuestro control giratorio. Cuando el usuario toca cualquier elemento de la ruleta, se invoca. Muestra un brindis con el nombre del elemento que el usuario seleccionó de la lista.

MainActivity.java

package org.geeksforgeeks.gfgcustomspinner;
  
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.Spinner;
import android.widget.Toast;
import java.util.ArrayList;
  
public class MainActivity extends AppCompatActivity {
  
    ArrayList<AlgorithmItem> algorithmItems;
    AlgorithmAdapter adapter;
  
    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        initList();
        Spinner spinner = findViewById(R.id.spinner_algorithm);
  
        // we pass our item list and context to our Adapter.
        adapter = new AlgorithmAdapter(this, algorithmItems);
        spinner.setAdapter(adapter);
  
        spinner.setOnItemSelectedListener(
            new AdapterView.OnItemSelectedListener() {
                @Override
                public void onItemSelected(AdapterView<?> parent,
                                           View view, int position, long id)
                {
  
                    // It returns the clicked item.
                    AlgorithmItem clickedItem = (AlgorithmItem)
                                                    parent.getItemAtPosition(position);
                    String name = clickedItem.getAlgorithmName();
                    Toast.makeText(MainActivity.this, name + " selected", Toast.LENGTH_SHORT).show();
                }
                @Override
                public void onNothingSelected(AdapterView<?> parent)
                {
                }
            });
    }
  
    // It is used to set the algorithm names to our array list.
    private void initList()
    {
        algorithmItems = new ArrayList<>();
        algorithmItems.add(new AlgorithmItem("Quick Sort"));
        algorithmItems.add(new AlgorithmItem("Merge Sort"));
        algorithmItems.add(new AlgorithmItem("Heap Sort"));
        algorithmItems.add(new AlgorithmItem("Prims Algorithm"));
        algorithmItems.add(new AlgorithmItem("Kruskal Algorithm"));
        algorithmItems.add(new AlgorithmItem("Rabin Karp"));
        algorithmItems.add(new AlgorithmItem("Binary Search"));
    }
}

Producción:

Publicación traducida automáticamente

Artículo escrito por madhavmaheshwarimm20 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

algoritmo_spinner.xml

AlgorithmItem.java

AlgorithmAdapter.java

actividad_principal.xml

MainActivity.java

Deja una respuesta Cancelar la respuesta