html текст
All interests
  • All interests
  • Design
  • Food
  • Gadgets
  • Humor
  • News
  • Photo
  • Travel
  • Video
Click to see the next recommended page
Like it
Don't like
Add to Favorites

ListView - красивые списки на Android

Вчера появилась у меня задача сделать ListView с картинками с боку, полазил по интернетам немного очканул потому что такое количество кода для такой простой задачи я никогда не видел, по три четыре файла с кодом на 100 и более строк, нашел как создавать самый обычный ListView (без картинок) и начал экспериментировать, долго я занимался сексом с этим listview, и очень долго психовал и бился головой об стену, но потом мне пришло озарение, а зачем я делаю все в массивах когда можно сделать все намного проще, и сделал как можно проще. Вот об этом проще я сегодня Вам и расскажу. Кому интересно прошу подкат.



Для тех кому не терпится вот то что у нас получится на выходе:


И так приступаем к созданию нашего ListView. Для начала я расскажу про создание обычного ListView без картинок что бы было понятно что к чему, куда и за чем.

Создаем проект в Eclipse — File — New — Progect — Android Project — ListviewActivity

И заходим в res — layout — main.xml. Начинаем редактировать. Для того что бы у нас был красивый ListView нам нужно его описать.

main.xml__________________________________________________________________________
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<ListView 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/list"
    />
</LinearLayout>


LinearLayout — главное поле на котором находится все остальные формы.
ListView — наш заветный ListView который мы сейчас делаем. Пока что это только формачка которая даже толком не отображается на форме.

И создаем второй файл — list.xml, который будет отображать текст в listview. Код расположился ниже:

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

  <LinearLayout
  android:layout_width="265dip"
  android:orientation="vertical"
  android:layout_height="wrap_content">
  
  <TextView android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:id="@+id/text1"
  android:textSize="25dip"
  android:text="This is text1"/>
  
  <TextView android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:id="@+id/text2"
  android:text="This is text2"/>
  
  </LinearLayout>
</LinearLayout>


LinearLayout — главное поле на котором находится все остальные формы.
TextView — наше поле в которые мы будем выводить текст из программы.

Теперь нам нужно написать код который будет запускаться и заполнять все наши пустые поля. Для этого открываем наш класс ListviewActivity.java и вставляем вот такой код:

ListviewActivity.java___________________________________________________________________
import java.util.ArrayList;
import java.util.HashMap;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ListView;
import android.widget.SimpleAdapter;
public class ListviewActivity extends Activity {
        private ArrayList <HashMap<String, Object>> myBooks; //наш массив объектов, без него никак
        private static final String BOOKKEY = "bookname";    // Главное название, большими буквами
        private static final String PRICEKEY = "bookprice";  // Наименование, то что ниже главного

        
    @Override
    public void onCreate(Bundle savedInstanceState)          //вход в программу
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);                       //говорим что запускать форму main.xml
        
        ListView listView = (ListView)findViewById(R.id.list);  //определяем наш ListView в main.xml 
        myBooks = new ArrayList<HashMap<String,Object>>();      //создаем массив списков
        HashMap<String, Object> hm;                             //список объектов 
        
       
        ///С помощью ключевого HashMap добавляем название (то что большими буквами), и описание (маленькими)
        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Коробке");                 //Название
        hm.put(PRICEKEY, "какой-то текст");         //Описание
     
        myBooks.add(hm);                            //Добавляем на форму для отображения, без этой функции мы не видим сам вью
        
        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Футболке");
        hm.put(PRICEKEY, "какой-то текст");
        
        myBooks.add(hm);
        
        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Робад");
        hm.put(PRICEKEY, "какой-то текст");
        
        myBooks.add(hm);
        
        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Еще коробке");
        hm.put(PRICEKEY, "какой-то текст");
     
        myBooks.add(hm);
        
       SimpleAdapter adapter = new SimpleAdapter(this, 
                                                 myBooks, 
                                                 R.layout.list, new String[]{ // массив названий
                                                 BOOKKEY,         //верхний текст
                                                 PRICEKEY,        //нижний теккт
                                                 }, new int[]{    //массив форм
                                                 R.id.text1,      //наш id TextBox'a в list.xml
                                                 R.id.text2});    //ссылка на объект отображающий текст
                
        listView.setAdapter(adapter);                         //говорим программе что бы отображала все объекты
        listView.setChoiceMode(ListView.CHOICE_MODE_SINGLE);  //Даем возможность выбора если есть желание сделать переход на другие формы
    }
}


И на выходе у нас получается вот такая красота:


Если вы сделали все правильно то у Вас должно все работать как часы.

Теперь давайте добавим картинки в наш проект, я свои картинки выкладывать не буду, предлагаю вставить обычный ic_launcher ну или свои :) Как пожелаете.

Открываем list.xml и перед последний LinearLayout вставляем

list.xml___________________________________________________________________________
<ImageView android:layout_width="55dip"
  android:layout_height="fill_parent"
  android:id="@+id/img"
  
  />


ImageView — картинка которая будет отображаться в нашем проекте.

Вот так выглядит полностью весь list.xml

list.xml___________________________________________________________________________
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="wrap_content"
  android:orientation="horizontal"
  android:layout_height="wrap_content">
  <LinearLayout
  android:layout_width="265dip"
  android:orientation="vertical"
  android:layout_height="wrap_content">
  
  <TextView android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:id="@+id/text1"
  android:textSize="25dip"
  android:text="This is text1"/>
  
  <TextView android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:id="@+id/text2"
  android:text="This is text2"/>
  
  </LinearLayout>
  
  <ImageView android:layout_width="55dip"
  android:layout_height="fill_parent"
  android:id="@+id/img"
  
  />
</LinearLayout>


Так как наш код для отображение изображений немного изменился но это маловидно, я напишу весь код сюда что бы не путать вас, что куда вставлять. Берем наш ListviewActivity.java и вставляем следующий код:

ListviewActivity.java______________________________________________________________
import java.util.ArrayList;
import java.util.HashMap;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ListView;
import android.widget.SimpleAdapter;
public class ListviewActivity extends Activity {
        private ArrayList <HashMap<String, Object>> myBooks;
        private static final String BOOKKEY = "bookname";
        private static final String PRICEKEY = "bookprice";
        private static final String IMGKEY = "iconfromraw";  //Наша будущая картинка

        
    @Override
    public void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        ListView listView = (ListView)findViewById(R.id.list);
        myBooks = new ArrayList<HashMap<String,Object>>();
        HashMap<String, Object> hm;

        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Коробке");
        hm.put(PRICEKEY, "какой-то текст");
        hm.put(IMGKEY, R.drawable.ic_launcher); //тут мы её добавляем для отображения
     
        myBooks.add(hm);
        
        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Футболке");
        hm.put(PRICEKEY, "какой-то текст");
        hm.put(IMGKEY,  R.drawable.ic_launcher); //тут мы её добавляем для отображения
        
        myBooks.add(hm);
        
        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Робад");
        hm.put(PRICEKEY, "какой-то текст");
        hm.put(IMGKEY,  R.drawable.ic_launcher); //тут мы её добавляем для отображения
        
        myBooks.add(hm);
        
        hm = new HashMap<String, Object>();
        hm.put(BOOKKEY, "Еще коробке");
        hm.put(PRICEKEY, "какой-то текст");
        hm.put(IMGKEY,  R.drawable.ic_launcher); //тут мы её добавляем для отображения
     
        myBooks.add(hm);
        
       SimpleAdapter adapter = new SimpleAdapter(this, 
                                                 myBooks, 
                                                 R.layout.list, new String[]{
                                                 BOOKKEY,         //верхний текст
                                                 PRICEKEY,        //нижний теккт
                                                 IMGKEY          //наша картинка
                                                 }, new int[]{
                                                 R.id.text1, //ссылка на объект отображающий текст
                                                 R.id.text2, //ссылка на объект отображающий текст
                                                 R.id.img}); //добавили ссылку в чем отображать картинки из list.xml
                
        listView.setAdapter(adapter);
        listView.setChoiceMode(ListView.CHOICE_MODE_SINGLE); 
    }
}


Запускаем наш проект и любуемся красивым ListView. Если есть какие-либо вопросы задавайте в комментариях буду рад ответить.
Читать дальше
Twitter
Одноклассники
Мой Мир

материал с dajver.blogspot.com

7

      Add

      You can create thematic collections and keep, for instance, all recipes in one place so you will never lose them.

      No images found
      Previous Next 0 / 0
      500
      • Advertisement
      • Animals
      • Architecture
      • Art
      • Auto
      • Aviation
      • Books
      • Cartoons
      • Celebrities
      • Children
      • Culture
      • Design
      • Economics
      • Education
      • Entertainment
      • Fashion
      • Fitness
      • Food
      • Gadgets
      • Games
      • Health
      • History
      • Hobby
      • Humor
      • Interior
      • Moto
      • Movies
      • Music
      • Nature
      • News
      • Photo
      • Pictures
      • Politics
      • Psychology
      • Science
      • Society
      • Sport
      • Technology
      • Travel
      • Video
      • Weapons
      • Web
      • Work
        Submit
        Valid formats are JPG, PNG, GIF.
        Not more than 5 Мb, please.
        30
        surfingbird.ru/site/
        RSS format guidelines
        500
        • Advertisement
        • Animals
        • Architecture
        • Art
        • Auto
        • Aviation
        • Books
        • Cartoons
        • Celebrities
        • Children
        • Culture
        • Design
        • Economics
        • Education
        • Entertainment
        • Fashion
        • Fitness
        • Food
        • Gadgets
        • Games
        • Health
        • History
        • Hobby
        • Humor
        • Interior
        • Moto
        • Movies
        • Music
        • Nature
        • News
        • Photo
        • Pictures
        • Politics
        • Psychology
        • Science
        • Society
        • Sport
        • Technology
        • Travel
        • Video
        • Weapons
        • Web
        • Work

          Submit

          Thank you! Wait for moderation.

          Тебе это не нравится?

          You can block the domain, tag, user or channel, and we'll stop recommend it to you. You can always unblock them in your settings.

          • dajver
          • домен dajver.blogspot.com
          • домен blogspot.com

          Get a link

          Спасибо, твоя жалоба принята.

          Log on to Surfingbird

          Recover
          Sign up

          or

          Welcome to Surfingbird.com!

          You'll find thousands of interesting pages, photos, and videos inside.
          Join!

          • Personal
            recommendations

          • Stash
            interesting and useful stuff

          • Anywhere,
            anytime

          Do we already know you? Login or restore the password.

          Close

          Add to collection

             

            Facebook

            Ваш профиль на рассмотрении, обновите страницу через несколько секунд

            Facebook

            К сожалению, вы не попадаете под условия акции