使用后台容器在自定义List-view上加载动态数据

时间:2013-04-11 13:28:18

标签: android android-layout listview android-widget

我对我的图片列表视图感到困惑。 我想用背景容器在一行中显示2个视频海报和文本视图(检查附加列车图像)

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

enter image description here

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

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

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

这是我的代码的输出。 enter image description here

这是我的代码

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中不推荐使用gallery我无法使用它。

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

感谢任何帮助。

2 个答案:

答案 0 :(得分:2)

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

<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" />

要访问我使用的每个图像视图和textview

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

感谢您的支持。 只有一个问题是可以根据行的位置改变每行的视图。

答案 1 :(得分:0)

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