2017-05-27 6 views
1

Im Lern ​​android und ich kann nicht einen Weg zu finden, scheine dies zu tun: enter imdescription herehorizontal Recycler Ansicht mit horizontaler Scroll

Ich möchte das Recht tun, mit nach links zu bewegen, was ich denke, wäre eine recylcer Ansicht sein, aber nicht sicher, ob es das ist. Ich brauche nur jemanden, der mich in die richtige Richtung weist. Ich denke, ich würde ein Innenlayout für die Recyclerview benötigen.

Wenn mir jemand zeigen könnte, wo ich das herausfinden würde, wäre ich so dankbar!

+0

hier setzen Sie Ihren Code schließlich. –

+0

Ja, Sie brauchen eine Recyclerview. Vielleicht brauchen Sie ein Tutorial https://developer.android.com/reference/android/support/v7/widget/RecyclerView.html https://developer.android.com/training/material/lists-cards.html –

Antwort

6

Schritt: 1

Erstellen Sie zwei Modellklassen wie unten.

package-name-here; 


public class SingleItemModel { 


    private String name; 
    private String url; 
    private String description; 


    public SingleItemModel() { 
    } 

    public SingleItemModel(String name, String url) { 
     this.name = name; 
     this.url = url; 
    } 


    public String getUrl() { 
     return url; 
    } 

    public void setUrl(String url) { 
     this.url = url; 
    } 

    public String getName() { 
     return name; 
    } 

    public void setName(String name) { 
     this.name = name; 
    } 

    public String getDescription() { 
     return description; 
    } 

    public void setDescription(String description) { 
     this.description = description; 
    } 


} 
  1. Erstellen Sie die anderen Modellklasse SectionDataModel.java

    package-name-here;; 
    
    import java.util.ArrayList; 
    
    
    public class SectionDataModel { 
    
    
    
    private String headerTitle; 
    private ArrayList<SingleItemModel> allItemsInSection; 
    
    
    public SectionDataModel() { 
    
    } 
    public SectionDataModel(String headerTitle, ArrayList<SingleItemModel> allItemsInSection) { 
        this.headerTitle = headerTitle; 
        this.allItemsInSection = allItemsInSection; 
    } 
    
    
    
    public String getHeaderTitle() { 
        return headerTitle; 
    } 
    
    public void setHeaderTitle(String headerTitle) { 
        this.headerTitle = headerTitle; 
    } 
    
    public ArrayList<SingleItemModel> getAllItemsInSection() { 
        return allItemsInSection; 
    } 
    
    public void setAllItemsInSection(ArrayList<SingleItemModel> allItemsInSection) { 
        this.allItemsInSection = allItemsInSection; 
    } 
    
    
    } 
    

3. Schritt: 2

eine Aktivität erstellen mit RecyclerView zu Zeige die Liste in vertikaler Reihenfolge.

package-name-here; 

import android.os.Bundle; 
import android.support.v7.app.AppCompatActivity; 
import android.support.v7.widget.LinearLayoutManager; 
import android.support.v7.widget.RecyclerView; 
import android.support.v7.widget.Toolbar; 

import com.pratap.gplaystore.adapters.RecyclerViewDataAdapter; 
import com.pratap.gplaystore.models.SectionDataModel; 
import com.pratap.gplaystore.models.SingleItemModel; 

import java.util.ArrayList; 

public class MainActivity extends AppCompatActivity { 

    private Toolbar toolbar; 


    ArrayList<SectionDataModel> allSampleData; 


    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 

     toolbar = (Toolbar) findViewById(R.id.toolbar); 

     allSampleData = new ArrayList<SectionDataModel>(); 

     if (toolbar != null) { 
      setSupportActionBar(toolbar); 
      toolbar.setTitle("G PlayStore"); 

     } 


     createDummyData(); 


     RecyclerView my_recycler_view = (RecyclerView) findViewById(R.id.my_recycler_view); 

     my_recycler_view.setHasFixedSize(true); 

     RecyclerViewDataAdapter adapter = new RecyclerViewDataAdapter(this, allSampleData); 

     my_recycler_view.setLayoutManager(new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false)); 

     my_recycler_view.setAdapter(adapter); 


    } 

    public void createDummyData() { 
     for (int i = 1; i <= 5; i++) { 

      SectionDataModel dm = new SectionDataModel(); 

      dm.setHeaderTitle("Section " + i); 

      ArrayList<SingleItemModel> singleItem = new ArrayList<SingleItemModel>(); 
      for (int j = 0; j <= 5; j++) { 
       singleItem.add(new SingleItemModel("Item " + j, "URL " + j)); 
      } 

      dm.setAllItemsInSection(singleItem); 

      allSampleData.add(dm); 

     } 
    } 
} 
  • ein XML-Layout für die oben genannte Aktivitätsklasse erstellen

activity_main.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     android:background="?attr/colorPrimary" 
     android:elevation="8dp" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
     app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> 


    <android.support.v7.widget.RecyclerView 
     android:id="@+id/my_recycler_view" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:scrollbars="none" /> 


</LinearLayout> 

Schritt: 3

Jetzt eine Adapter-Klasse für das recyclerView erstellen in die MainActivity.

RecyclerViewDataAdapter.

java
package-name-here.adapters; 


import android.content.Context; 
import android.support.v7.widget.LinearLayoutManager; 
import android.support.v7.widget.RecyclerView; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.Button; 
import android.widget.TextView; 
import android.widget.Toast; 

import com.pratap.gplaystore.R; 
import com.pratap.gplaystore.models.SectionDataModel; 

import java.util.ArrayList; 

public class RecyclerViewDataAdapter extends RecyclerView.Adapter<RecyclerViewDataAdapter.ItemRowHolder> { 

    private ArrayList<SectionDataModel> dataList; 
    private Context mContext; 

    public RecyclerViewDataAdapter(Context context, ArrayList<SectionDataModel> dataList) { 
     this.dataList = dataList; 
     this.mContext = context; 
    } 

    @Override 
    public ItemRowHolder onCreateViewHolder(ViewGroup viewGroup, int i) { 
     View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.list_item, null); 
     ItemRowHolder mh = new ItemRowHolder(v); 
     return mh; 
    } 

    @Override 
    public void onBindViewHolder(ItemRowHolder itemRowHolder, int i) { 

     final String sectionName = dataList.get(i).getHeaderTitle(); 

     ArrayList singleSectionItems = dataList.get(i).getAllItemsInSection(); 

     itemRowHolder.itemTitle.setText(sectionName); 

     SectionListDataAdapter itemListDataAdapter = new SectionListDataAdapter(mContext, singleSectionItems); 

     itemRowHolder.recycler_view_list.setHasFixedSize(true); 
     itemRowHolder.recycler_view_list.setLayoutManager(new LinearLayoutManager(mContext, LinearLayoutManager.HORIZONTAL, false)); 
     itemRowHolder.recycler_view_list.setAdapter(itemListDataAdapter); 


     itemRowHolder.btnMore.setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 


       Toast.makeText(v.getContext(), "click event on more, "+sectionName , Toast.LENGTH_SHORT).show(); 



      } 
     }); 


     /* Glide.with(mContext) 
       .load(feedItem.getImageURL()) 
       .diskCacheStrategy(DiskCacheStrategy.ALL) 
       .centerCrop() 
       .error(R.drawable.bg) 
       .into(feedListRowHolder.thumbView);*/ 
    } 

    @Override 
    public int getItemCount() { 
     return (null != dataList ? dataList.size() : 0); 
    } 

    public class ItemRowHolder extends RecyclerView.ViewHolder { 

     protected TextView itemTitle; 

     protected RecyclerView recycler_view_list; 

     protected Button btnMore; 



     public ItemRowHolder(View view) { 
      super(view); 

      this.itemTitle = (TextView) view.findViewById(R.id.itemTitle); 
      this.recycler_view_list = (RecyclerView) view.findViewById(R.id.recycler_view_list); 
      this.btnMore= (Button) view.findViewById(R.id.btnMore); 


     } 

    } 

} 
  • nun eine XML-Layout-Datei für die oben genannte Adapterklasse erstellen.

list_item.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 

    android:background="?android:selectableItemBackground" 
    android:orientation="vertical" 
    android:padding="5dp"> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:padding="2dp"> 


     <TextView 
      android:id="@+id/itemTitle" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_alignParentLeft="true" 
      android:layout_alignParentStart="true" 
      android:layout_centerVertical="true" 
      android:layout_gravity="center_vertical" 
      android:layout_toLeftOf="@+id/btnMore" 
      android:text="Sample title" 
      android:textColor="@android:color/black" 
      android:textSize="18sp" /> 

     <Button 
      android:id="@+id/btnMore" 
      android:layout_width="wrap_content" 
      android:layout_height="42dp" 
      android:layout_alignParentEnd="true" 
      android:layout_alignParentRight="true" 
      android:layout_centerVertical="true" 
      android:theme="@style/MyButton" 
      android:text="more" 
      android:textColor="#FFF" /> 


    </RelativeLayout> 

    <android.support.v7.widget.RecyclerView 
     android:id="@+id/recycler_view_list" 
     android:layout_width="match_parent" 
     android:layout_height="160dp" 
     android:layout_gravity="center_vertical" 
     android:orientation="horizontal" /> 


</LinearLayout> 

Schritt: 4

Um nun eine horizontale RecyclerView zu machen, müssen wir für jede Zeile ein Layout und Adapter-Klasse erstellen.

list_single_card.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:orientation="horizontal" 
    app:cardCornerRadius="5dp" 
    app:cardUseCompatPadding="true" 
    > 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:padding="0dp" 
     android:background="?android:selectableItemBackground" 
     android:orientation="vertical"> 

     <ImageView 
      android:id="@+id/itemImage" 
      android:layout_width="100dp" 
      android:layout_height="100dp" 
      android:layout_gravity="center_horizontal" 
      android:scaleType="fitCenter" 
      android:src="@drawable/android" /> 


     <TextView 
      android:id="@+id/tvTitle" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_below="@id/itemImage" 
      android:gravity="center" 
      android:padding="5dp" 
      android:text="Sample title" 
      android:textColor="@android:color/black" 
      android:textSize="18sp" /> 


    </LinearLayout> 

</android.support.v7.widget.CardView> 
  • Der Adapter Klasse für
  • Horizontal RecyclerView

SectionListDataAdapter.java

package-name-here.adapters; 


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.ImageView; 
import android.widget.TextView; 
import android.widget.Toast; 

import com.pratap.gplaystore.R; 
import com.pratap.gplaystore.models.SingleItemModel; 

import java.util.ArrayList; 

public class SectionListDataAdapter extends RecyclerView.Adapter<SectionListDataAdapter.SingleItemRowHolder> { 

    private ArrayList<SingleItemModel> itemsList; 
    private Context mContext; 

    public SectionListDataAdapter(Context context, ArrayList<SingleItemModel> itemsList) { 
     this.itemsList = itemsList; 
     this.mContext = context; 
    } 

    @Override 
    public SingleItemRowHolder onCreateViewHolder(ViewGroup viewGroup, int i) { 
     View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.list_single_card, null); 
     SingleItemRowHolder mh = new SingleItemRowHolder(v); 
     return mh; 
    } 

    @Override 
    public void onBindViewHolder(SingleItemRowHolder holder, int i) { 

     SingleItemModel singleItem = itemsList.get(i); 

     holder.tvTitle.setText(singleItem.getName()); 


     /* Glide.with(mContext) 
       .load(feedItem.getImageURL()) 
       .diskCacheStrategy(DiskCacheStrategy.ALL) 
       .centerCrop() 
       .error(R.drawable.bg) 
       .into(feedListRowHolder.thumbView);*/ 
    } 

    @Override 
    public int getItemCount() { 
     return (null != itemsList ? itemsList.size() : 0); 
    } 

    public class SingleItemRowHolder extends RecyclerView.ViewHolder { 

     protected TextView tvTitle; 

     protected ImageView itemImage; 


     public SingleItemRowHolder(View view) { 
      super(view); 

      this.tvTitle = (TextView) view.findViewById(R.id.tvTitle); 
      this.itemImage = (ImageView) view.findViewById(R.id.itemImage); 


      view.setOnClickListener(new View.OnClickListener() { 
       @Override 
       public void onClick(View v) { 


        Toast.makeText(v.getContext(), tvTitle.getText(), Toast.LENGTH_SHORT).show(); 

       } 
      }); 


     } 

    } 

} 
4

U diese Art von Layout mit recyclerview implementieren können

Wenn Sie eine RecyclerView verwenden, benötigen Sie einen Layoutmanager angeben, die zum Auslegen jedes Element in der Ansicht verantwortlich ist. Mit dem LinearLayoutManager können Sie genau wie bei einem normalen LinearLayout eine Ausrichtung festlegen.

Um eine horizontale Liste mit RecyclerView erstellen, können Sie etwas tun könnten:

LinearLayoutManager linearLayoutManager 
    = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false); 

RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerView); 
recyclerView.setLayoutManager(linearLayoutManager); 

Hoffnung diese Hilfe u ... wenn u Hilfe benötigen können u

fragen
2

Hier Kurzanleitung ist für Ihr Horizontal Recyclerview

XML Datei

<android.support.v7.widget.RecyclerView 
       android:id="@+id/recyclerView" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:scrollbars="horizontal"/> 

Java-Code

RecyclerView recyclerView= (RecyclerView) findViewById(R.id.recyclerView); 
    LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false); 
    recyclerView.setLayoutManager(layoutManager); 
Verwandte Themen