How to create my above listview to look more professional?

Can someone tell me how should am i going to create my listview which look similar [here][1].

Problem: How am i going to fulfill the sort of look and feel in my codes which has an icons, file name, and file size yet at the same time looking clean and simple on each file object as s开发者_如何学Gohown in the example in the link [here][2]??

Can someone guide on this matter because i'm rather new in android/java... Thanks

Refer to following url for how to implement custom listview

Update

public static class VideoInfo   {
        public String name = "";
        public String size= "";
        public String path = "";//add any more variables of which you want info
    }

then where you are creating arraylist i.e getVideoFiles() create object of this class Declare ArrayList<VideoInfo> videoItems;

private void getVideoFiles(File[] videoList) 
 {
      videoItems = new ArrayList<VideoInfo>();

      for (int i = 0; i < videolist.length; i++) 
      {
        File mfile = videoList[i];
      String path = mfile.getPath();
      path = path.substring(path.lastIndexOf("/", path.indexOf("."));
      VideoInfo model = new VideoInfo();
      model.name = path;
      model.size = mfile.length();

      videoItems.add(model);
      }

      setListAdapter(new ListViewAdapter(this, R.layout.row, videoItems));  
 }

now in your adapter pass this object of arraylist and how you set variables in listview is already given in link above

Problem 2: And why is my listview having error when the directory is empty despite having this to handle the "empty" in my xml

did you remember to name your listview?:

@id/android:list

And if you could for further helper PLEASE clear up problem 1, so its more clear and concise what you want.

UPDATE

The ID of the listview should be: @id/android:list

The ID of the texview should be: @id/android:empty

You haven't create custom adapter to incorporate the layout into codes listview. Here is something you can use

private class ListViewAdapter extends ArrayAdapter<Object> {
        private ArrayList<Object> items;

        public ListViewAdapter(Context context, int textViewResourceId,
                ArrayList<Object> items) {
            super(context, textViewResourceId, items);
            this.items = items;

        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            View v = convertView;
            Object info = items.get(position);
            if (v == null) {
                LayoutInflater vi = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
                v = vi.inflate(R.layout.row, null);
            }

            if (info != null) {
                ImageView imView = (ImageView) v.findViewById(R.id.icon);
                TextView txtname =(TextView) v.findViewById(R.id.toptext);
                TextView txtAddr = (TextView) v.findViewById(R.id.bottomtext);
                //set image and set text as you like
            }
            return v;
        }
    }

Hope this can help.

First Create the Layout that you want to display for each row in your list then Extend the BaseAdapter class to Customize your Lists. This class contains getView method to replicate the rows in your lists as many times as you want to.

class HighScoreAdapter extends BaseAdapter { /* layout inflater to convert your XML layout to View to be rendered in your Each row of Lists.*/ private LayoutInflater minflator = LayoutInflater.from(HighScoreList.this); ViewHolder holder;

    @Override
    public Object getItem(int position)
    {
        return position;
    }

    @Override
    public long getItemId(int position)
    {
        return position;
    }
    boolean toRemove = false;
    @Override
    public View getView(int position, View convertView, ViewGroup parent)
    {
                    /* first time is null */
        if (convertView == null )
        {
            convertView = minflator.inflate(R.layout.highscorelist, null);
            holder = new ViewHolder();
            holder.rank = (TextView) convertView.findViewById(R.id.user_id);
            holder.username = (EditText) convertView.findViewById(R.id.user_nameedit);
            holder.time = (TextView) convertView.findViewById(R.id.user_time);
            convertView.setTag(holder);
        }
        else
        {
            holder  =   (ViewHolder) convertView.getTag();
        }

        holder.rank.setText(String.valueOf(position+1)+".");

        /* returns the view for next row as layout will be same i.e. this increases the your list's scrolling and working faster even though your list contains thousands of Entry*/
        return convertView;
    }
             /* this class is to make reference to your child views of your layout by using this you can set your child views properties and Listeners acording to your need.*/
    class ViewHolder
    {
        TextView rank;
        EditText username;
        TextView time;
    }

}

I hope this solves your problem completely.. :)

Add this method to your code and if you get any error or Exception please let me know.

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View v = convertView;
        Object info = items.get(position);
        if (v == null) {
            LayoutInflater vi = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            v = vi.inflate(R.layout.row, null);
        }

        if (info != null) {
            ImageView imView = (ImageView) v.findViewById(R.id.icon);
            TextView txtname =(TextView) v.findViewById(R.id.toptext);
            TextView txtAddr = (TextView) v.findViewById(R.id.bottomtext);
            //set image and set text as you like

               imview.setImageBitmap(IMAGE YOU WANT TO SET AAS ICON);

               txtname.setText(FILENAME YOU WANT TO SET);

               txtadr,setText(FILESIZE YOU WANT TO SET);

              // Better you take each info filename,filesize and icon in a arraylist and set them 

        }


        return v;
    }