3

我完全对我的图像列表视图感到困惑。我想在带有背景容器的单行中显示 2 个视频海报和文本视图（检查火车的附加图像）

这是垂直列表视图的单个单元格。

在此处输入图像描述

根据视频的数量，我必须显示垂直列表视图，但每行包含 2 个视频海报和视频侧面的文本视图，其中火车引擎图像在开始或结束，反之亦然。

为了实现这个 UI，我编写了一个自定义适配器，在其中我设法通过使用相对布局来显示具有相关图像视图的火车车厢。

但是我如何管理单行上特定项目（行中的特定视频）的点击监听器。以及如何在每行的开头或结尾添加火车图像

这是我的代码的输出。 在此处输入图像描述

这是我的代码

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    //setContentView(R.layout.main);
    final Context context = CustomAdapterExample.this;
    ListView ls2 = new ListView(context);
// clear previous results in the LV
    ls2.setAdapter(null);        
    // populate
    ArrayList<Device> videos = new ArrayList<Device>();
    Device my_video;
        for (int i=0;i<05;i++) {
            my_video = new Device("video link","Video id");
        videos.add(my_video);
        }
    CustomAdapter lvAdapter =  new CustomAdapter(context, videos);
    ls2.setAdapter(lvAdapter);
    ls2.setOnItemClickListener(new OnItemClickListener() 
    {
        public void onItemClick(AdapterView<?> arg0, View arg1,int arg2, long arg3) 
        {
            Toast.makeText(getBaseContext(), "You clicked on "+arg2, Toast.LENGTH_LONG).show();
        }
    });
     setContentView(ls2);
}

这是适配器

class CustomAdapterView extends LinearLayout {        
public CustomAdapterView(Context context, Device device) 
{
    super( context );   
    //container is a horizontal layer
     setOrientation(LinearLayout.HORIZONTAL);
    setPadding(0, 6, 0, 6);
    LinearLayout Mainview = new LinearLayout(context);
    LinearLayout.LayoutParams Cellparams = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
    Mainview.setLayoutParams(Cellparams);
    ImageView firstImageContainer = new ImageView(context);
    ImageView trackImage = new ImageView(context);
    ImageView VideoViewContainer = new ImageView(context);
    TextView firsttext= new TextView(context);
    firsttext.setText("Testing of app");
    firsttext.setTextColor(Color.RED);
    firstImageContainer.setBackgroundResource(R.drawable.wagon); 
    VideoViewContainer.setBackgroundResource(R.drawable.video); 
    RelativeLayout layout = new RelativeLayout(context);
     RelativeLayout.LayoutParams firstContainerParams = new RelativeLayout.LayoutParams(160, 80);
     layout.setLayoutParams(firstContainerParams);
     trackImage.setBackgroundResource(R.drawable.line);
     RelativeLayout.LayoutParams trackRules = new RelativeLayout.LayoutParams(755,5); 
     trackRules.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
    RelativeLayout.LayoutParams firstImageContainerParams = new RelativeLayout.LayoutParams(140, 90);
     RelativeLayout.LayoutParams VideoViewContainerParams = new RelativeLayout.LayoutParams(70,60); 
     VideoViewContainerParams.addRule(RelativeLayout.CENTER_VERTICAL);
     VideoViewContainerParams.setMargins(5, 0, 0, 0);
     layout.addView(firstImageContainer, firstImageContainerParams);
     layout.addView(VideoViewContainer, VideoViewContainerParams);
     layout.addView(trackImage, trackRules);
     ImageView secondImageContainer = new ImageView(context);
    ImageView secondtrackImage = new ImageView(context);
    ImageView secondVideoViewContainer = new ImageView(context);
    secondImageContainer.setBackgroundResource(R.drawable.wagon); 
    secondVideoViewContainer.setBackgroundResource(R.drawable.video); 
    RelativeLayout secondLayout = new RelativeLayout(context);
     RelativeLayout.LayoutParams secondContainerParams = new RelativeLayout.LayoutParams(160, 80);
    secondLayout.setLayoutParams(firstContainerParams);
    secondtrackImage.setBackgroundResource(R.drawable.line);
     RelativeLayout.LayoutParams secondtrackRules = new RelativeLayout.LayoutParams(755,5); 
     trackRules.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
    RelativeLayout.LayoutParams secondImageContainerParams = new RelativeLayout.LayoutParams(140, 90);
     RelativeLayout.LayoutParams secondVideoViewContainerParams = new RelativeLayout.LayoutParams(70,60); 
    secondVideoViewContainerParams.addRule(RelativeLayout.CENTER_VERTICAL);
    secondVideoViewContainerParams.setMargins(5, 0, 0, 0);
    secondLayout.addView(secondImageContainer, secondImageContainerParams);
    secondLayout.addView(secondVideoViewContainer, secondVideoViewContainerParams);
    secondLayout.addView(secondtrackImage, secondtrackRules);
     firstContainerParams.addRule(RelativeLayout.ALIGN_LEFT);
     secondImageContainerParams.addRule(RelativeLayout.ALIGN_RIGHT);
    Mainview.addView(layout,firstContainerParams);
    Mainview.addView(secondLayout,secondContainerParams);
    addView(Mainview);
}
     }
  public class CustomAdapter extends BaseAdapter /*implements OnClickListener*/ {
public static final String LOG_TAG = "BI::CA";
private Context context;
private List<videoData> videolist;
public CustomAdapter(Context context, List<Device> videolist ) { 
    this.context = context;
    this.videolist = videolist;
}
public int getCount() {                        
    return videolist.size();
}
public Object getItem(int position) {     
    return videolist.get(position);
}
public long getItemId(int position) {  
    return position;
}
public View getView(int position, View convertView, ViewGroup parent) 
{ 
    Device device = videolist.get(position);
    View v = new CustomAdapterView(this.context, device );  
    return v;
}
}

如果我的实施是错误的，请给我一些指导。图库在 API 17 中已弃用，我无法使用它。

是否可以通过使用 tableview 或网格视图来创建这样的 Ui？

任何帮助表示赞赏。

4

2 回答 2

2

最后，我想通过在列表视图布局中使用包含标记来显示所有包含与其他设备上相同的内容。

<HorizontalScrollView
    android:id="@+id/horizontalScrollView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >
    <include android:id="@+id/train2" layout="@layout/train2" />
</HorizontalScrollView>

在火车上我有这个

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal">
    <include android:id="@+id/boogi1" layout="@layout/boogi" />
    <include android:id="@+id/boogi2" layout="@layout/boogi" />
     <include android:id="@+id/engine" layout="@layout/engine" />

并访问我使用的每个图像视图和文本视图

 ImageView v1 = ((ImageView)vi.findViewById(R.id.train).findViewById(R.id.boogi1).findViewById(R.id.imageView1));

谢谢你的支持。只有一个问题是可以根据行的位置更改每一行的视图..

于 2013-04-15T09:17:53.630 回答
0

我认为你需要尝试自定义 Listview，，试试这个 http://www.androidhive.info/2012/02/android-custom-listview-with-image-and-text/。

于 2013-04-11T13:35:41.230 回答