代码之家  ›  专栏  ›  技术社区  ›  moe_nyc

带水平滚动视图的ListView

  •  6
  • moe_nyc  · 技术社区  · 9 年前

    我正在尝试制作一个列表视图,它由每一行的水平滚动视图组成。我希望元素垂直排列,这样如果有超过一定数量的项目,视图就可以滚动。

    然而,结果却是这样。

    enter image description here

    我正在扩展以下xml

    单行.xml

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="fill_parent"
        android:background="#FFFFFF"
        android:layout_height="fill_parent">
    
        <HorizontalScrollView  xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/horizontal"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" >
    
            <LinearLayout
                android:orientation="vertical"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent">
    
            <com.example.jj.library.ChipView
                android:layout_weight="1"
                android:id="@+id/text_chip_layout"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content" />
            </LinearLayout>
    
        </HorizontalScrollView>
    
    </LinearLayout>
    

    这是我的适配器,用于将视图添加到视图中

    适配器.java

    import android.content.Context;
    import android.util.Log;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ArrayAdapter;
    
    import com.example.jj.library.Chip;
    import com.example.jj.library.ChipView;
    import com.example.jj.library.ChipViewAdapter;
    import com.example.jj.library.OnChipClickListener;
    
    import java.util.ArrayList;
    import java.util.List;
    
    /**
     * Created by jj on 12/21/2015.
     */
    public class LiveFeedAdapter extends ArrayAdapter<LiveFeedDataProvider> implements OnChipClickListener {
    
    
        private static final String TAG = "LIVEFEED ADAPTER";
        Context CTX;
        private ChipView mTextChipLayout;
        public List<LiveFeedDataProvider> liveFeed_list = new ArrayList<LiveFeedDataProvider>();
    
        public LiveFeedAdapter(Context context, int resource) {
            super(context, resource);
            CTX = context;
        }
    
        @Override
        public void add(LiveFeedDataProvider object){
            liveFeed_list.add(object);
            super.add(object);
        }
    
        @Override
        public int getCount() {
            return liveFeed_list.size();
        }
    
    
        @Override
        public LiveFeedDataProvider getItem(int position) {
    
            return liveFeed_list.get(position);
        }
    
        @Override
        public View getView(final int position, View convertView, final ViewGroup parent) {
            if(convertView == null){
                LayoutInflater inflator = (LayoutInflater) CTX.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                convertView = inflator.inflate(R.layout.single_livefeed_row,parent,false);
            }
            ChipViewAdapter adapterLayout = new MainChipViewAdapter(getContext());
            mTextChipLayout = (ChipView) convertView.findViewById(R.id.text_chip_layout);
            mTextChipLayout.setAdapter(adapterLayout);
            mTextChipLayout.setChipLayoutRes(R.layout.chip_close);
            mTextChipLayout.setChipBackgroundColor(CTX.getResources().getColor(R.color.light_blue));
            mTextChipLayout.setChipBackgroundColorSelected(CTX.getResources().getColor(R.color.green));
            mTextChipLayout.setOnChipClickListener(this);
            LiveFeedDataProvider provider = liveFeed_list.get(position);
            Log.d(TAG, "LENGTH = " + provider.interests.length);
            for(int i = 0; i < provider.interests.length; i++) {
                String interest = provider.interests[i];
                mTextChipLayout.add(new Tag(interest));
            }
                return convertView;
        }
    
        @Override
        public void onChipClick(Chip chip) {
    
        }
    
    }
    
    1 回复  |  直到 9 年前
        1
  •  16
  •   Konstantin Loginov    9 年前

    我用另一种方式解决了你的问题:我替换了 HorizontalScrollView ListView RecyclerView 每行作为 回收站视图 我认为,这是这里的首选布局。

    结果如下:

    enter image description here

    (不要太在意丑陋的设计:-)

    MainActivity 布局

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.v7.widget.RecyclerView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:background="#FFFFFF"
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
    

    主要活动 类别:

    public class MainActivity extends AppCompatActivity {
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            RecyclerView chipRecyclerView = (RecyclerView)findViewById(R.id.recyclerView);
            chipRecyclerView.setLayoutManager(new LinearLayoutManager(this));
    
            ArrayList<String[]> chipsArray = new ArrayList<>();
            chipsArray.add(new String[] {"Fitness", "Gaming", "Education","Animals", "Cars"});
            .....
            chipsArray.add(new String[] {"Education","Animals", "Cars"});
    
            chipRecyclerView.setAdapter(new ListChipsAdapter(chipsArray));
        }
    }
    

    ListChipsAdapter -适配器 主要活动 的回收器视图。它管理带有芯片的行列表。

    public class ListChipsAdapter extends RecyclerView.Adapter {
    
        private ArrayList<String[]> chipsArray;
    
        public ListChipsAdapter(ArrayList<String[]> chipsArray) {
            this.chipsArray = chipsArray;
        }
    
        @Override
        public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            return new ChipsViewHolder(new RowChipsView(parent.getContext()));
        }
    
        @Override
        public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
            ((RowChipsView)holder.itemView).setAdapter(new ChipsAdapter(chipsArray.get(position)));
        }
    
        @Override
        public int getItemCount() {
            return chipsArray.size();
        }
    
        private class ChipsViewHolder extends RecyclerView.ViewHolder {
    
            public ChipsViewHolder(View itemView) {
                super(itemView);
            }
        }
    }
    

    RowChipsView -是表示特定单行的类:

    public class RowChipsView extends FrameLayout {
    
        public RowChipsView(Context context) {
            super(context);
            initializeView(context);
        }
    
        private void initializeView(Context context) {
            LayoutInflater.from(context).inflate(R.layout.single_row, this);
            ((RecyclerView)findViewById(R.id.recyclerViewHorizontal)).setLayoutManager(new LinearLayoutManager(context, LinearLayoutManager.HORIZONTAL, false));
        }
    
        public void setAdapter(ChipsAdapter adapter) {
            ((RecyclerView)findViewById(R.id.recyclerViewHorizontal)).setAdapter(adapter);
        }
    }
    

    它的布局只有一个 回收站视图 :

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.v7.widget.RecyclerView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/recyclerViewHorizontal"
        android:layout_width="match_parent"
        android:layout_height="56dp"/>
    

    现在 ChipsAdapter -每个单行使用的适配器:

    public class ChipsAdapter extends RecyclerView.Adapter {
    
        private String[] chipsArray;
    
        public ChipsAdapter(String[] chipsArray) {
            this.chipsArray = chipsArray;
        }
    
        @Override
        public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            return new ChipViewHolder(new ChipView(parent.getContext()));
        }
    
        @Override
        public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
            ((ChipView)holder.itemView).displayItem(chipsArray[position]);
        }
    
        @Override
        public int getItemCount() {
            return chipsArray.length;
        }
    
        private class ChipViewHolder extends RecyclerView.ViewHolder {
    
            public ChipViewHolder(View itemView) {
                super(itemView);
            }
        }
    }
    

    现在,最后一块是 ChipView :

    public class ChipView extends FrameLayout {
    
        public ChipView(Context context) {
            super(context);
            initializeView(context);
        }
    
        private void initializeView(Context context) {
            LayoutInflater.from(context).inflate(R.layout.chip_view, this);
        }
    
        public void displayItem(String text) {
            ((TextView)findViewById(R.id.chipTextView)).setText(text);
        }
    }
    

    它的布局:

    <?xml version="1.0" encoding="utf-8"?>
    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:background="@drawable/rounded_background"
        android:layout_margin="4dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/chipTextView"
            android:textColor="#FFFFFF"
            android:textSize="24sp"
            android:padding="8dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </FrameLayout>
    

    我已经将项目上传到我的邮箱,所以 feel free to check it out!

    我希望,这有帮助。