1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Android ListViewの中に、ヘッダーとコンテンツを入れて一緒にスクロールするサンプル

Last updated at Posted at 2017-11-03


ListViewの中に、ヘッダーとコンテンツを入れて一緒にスクロールするサンプル
Android Studio 2.3.2

001.png
002.png
003.png
004.png

005.png

MainActivity
package com.example.non.nonsample;

import android.content.Intent;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.net.Uri;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListView;
import java.util.ArrayList;
import java.util.List;

/**
 * MainActivity
 */
public class MainActivity extends AppCompatActivity implements AdapterView.OnItemClickListener {
    //コンテンツ内容
    private List<ContentsData> contentsDataList;
    //先頭行セルimage
    private ImageData imageData;
    //メインのリストビュー
    private ListView mainListView;
    //Click時のURL
    private String HEADER_URL = "http://book.geocities.jp/nonpipo/index.html";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //メインのリストビュー
        mainListView = (ListView)findViewById(R.id.main_listView);

        //リスト内のコンテンツ
        contentsDataList= new ArrayList<>();
        ContentsData contentsData = new ContentsData();
        for(int i =0; i < 20; i++) {
            contentsData = new ContentsData();
            contentsData.setName("test:" + i);
            contentsDataList.add(contentsData);
        }

        //先頭行セルimageセット
        Bitmap nonicon_bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.smal_noncoin);
        imageData = new ImageData();
        imageData.setImage(nonicon_bitmap);
        imageData.setTargetUrl(HEADER_URL);

        //Adapter
        NonAdapter nonadapter = new NonAdapter(this.getApplicationContext(),contentsDataList,imageData);
        mainListView.setAdapter(nonadapter);
        //ClickListener
        mainListView.setOnItemClickListener(this);
    }

    @Override
    public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
       if(position == 0){
           //先頭行セルClickのみ外部ブラウザで起動する
           startExternalBrowser();
       }
    }

   /**
    * startExternalBrowser 外部ブラウザで起動する
    */
    public void startExternalBrowser(){
        Log.d("MainActivity","startExternalBrowser start");
        try{
            Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(imageData.getTargetUrl()));
            intent.setClassName("com.android.browser", "com.android.browser.BrowserActivity");
            startActivity(intent);
        }catch(Exception e){
            Log.e("startExternalBrowser","Exception:" + e);
        }
    }

}
NonAdapter
package com.example.non.nonsample;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Color;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.List;

/**
 * NonAdapter
 */
public class NonAdapter extends BaseAdapter{
    private Context context;
    private List<ContentsData> contentsDataList;
    private ImageData imageData;
    //viewの数(ヘッダーとコンテンツの2種類)
    private int viewCount = 0;
    //ヘッダー行の数(1行)
    private int headerCount = 0;
    //コンテンツ行の数
    private int contentsCount = 0;
    //全ての行数(ヘッダー行とコンテンツ行の合計行数)
    private int all_dataCount = 0;
    private LayoutInflater inflater;
    private enum ViewTypeMode {
        HEADER, //
        CONTENTS //
        ;
    }

    /**
     * NonAdapter
     * @param context
     * @param para_contentsData
     * @param para_imageData
     */
    public NonAdapter(Context context, List<ContentsData> para_contentsData,ImageData para_imageData) {
        super();
        this.context = context;
        //引数 コンテンツデータ
        contentsDataList = para_contentsData;
        //引数 ヘッダーデータ
        imageData = para_imageData;
        inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        if(imageData != null){
            headerCount = 1;
            viewCount = 1;
        }

        if(contentsDataList.size() > 0){
            contentsCount = contentsDataList.size();
            viewCount ++;
        }
        all_dataCount = headerCount + contentsCount;
    }

    /**
     * @return viewの種類数(ヘッダーとコンテンツの2つ)
     */
    @Override
    public int getViewTypeCount(){
        return viewCount;
    }

    /**
     *
     * @return 全ての行数
     */
    @Override
    public int getCount() {
        return all_dataCount;
    }

    /**
     * itemのタイプ
     * @param position
     * @return
     */
    @Override
    public int getItemViewType(int position) {
        return position == 0 ? ViewTypeMode.HEADER.ordinal() : ViewTypeMode.CONTENTS.ordinal();
    }

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

    @Override
    public long getItemId(int i) {
        return i;
    }

    /**
     * @param position
     * @param view
     * @param viewGroup
     * @return
     */
    @Override
    public View getView(int position, View view, ViewGroup viewGroup) {

        //viewのType
        int viewType = getItemViewType(position);


        if(viewType == ViewTypeMode.HEADER.ordinal()) {
            //Header
            if(view == null || (Integer)view.getTag() == ViewTypeMode.CONTENTS.ordinal()) {
                //viewが変わったら再設定する
                view = setHeaderView(view, viewType);
            }
            //ヘッダー行を設定する
            ImageView imageView =(ImageView) view.findViewById(R.id.lead_imageView);
            imageView.setImageBitmap((Bitmap) imageData.getImage());

        }else{
            //ヘッダーを引いた位置
            int index = position - headerCount;
            //Contents
            if(view == null || (Integer)view.getTag() == ViewTypeMode.HEADER.ordinal()) {
                //viewが変わったら再設定する
                view = setContentsView(view, viewType);
            }
            //コンテンツ行を設定する
            TextView contentsView =(TextView) view.findViewById(R.id.contents_cell_text_view);
            ContentsData contentsData = contentsDataList.get(index);
            contentsView.setText(contentsData.getName());
            contentsView.setTextColor(Color.BLACK);
        }

        return view;
    }

    /**
     * setHeaderView ヘッダーview設定
     * @param view
     * @param viewType
     * @return
     */
    private View setHeaderView(View view,int viewType){
        view = inflater.inflate(R.layout.lead_cell, null);
        view.setTag(ViewTypeMode.HEADER.ordinal());
        return view;
    }

    /**
     * setContentsView コンテンツview設定
     * @param view
     * @param viewType
     * @return
     */
    private View setContentsView(View view,int viewType){
        view = inflater.inflate(R.layout.contents_cell, null);
        view.setTag(ViewTypeMode.CONTENTS.ordinal());
        return view;
    }

}
ContentsData
package com.example.non.nonsample;

/**
 * ContentsData
 */
public class ContentsData {
    String name;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

ImageData
package com.example.non.nonsample;

import android.graphics.Bitmap;

/**
 * ImageData
 */
public class ImageData {
    // image
    private Bitmap image;
    // 外部ブラウザ起動先URL
    private String targetUrl;

    public Bitmap getImage() {
        return image;
    }

    public void setImage(Bitmap image) {
        this.image = image;
    }

    public String getTargetUrl() {
        return targetUrl;
    }

    public void setTargetUrl(String targetUrl) {
        this.targetUrl = targetUrl;
    }
}

activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.non.nonsample.MainActivity">

  <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent">

      <ListView
          android:id="@+id/main_listView"
          android:layout_width="match_parent"
          android:layout_height="wrap_content">
      </ListView>
  </LinearLayout>

</android.support.constraint.ConstraintLayout>

contetns_cell.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <RelativeLayout
        android:id ="@+id/contents_cell_layout"
        android:layout_width="match_parent"
        android:layout_height="50dp">
        <TextView
            android:id="@+id/contents_cell_text_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textSize="30dp"
            android:textStyle="bold" />
    </RelativeLayout>
</LinearLayout>
lead_cell.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <RelativeLayout
        android:id ="@+id/lead_cell_layout"
        android:layout_width="fill_parent"
        android:layout_height="50dp">
       <ImageView
           android:id="@+id/lead_imageView"
           android:scaleType="fitXY"
           android:layout_width="match_parent"
           android:layout_height="match_parent"/>
    </RelativeLayout>
</LinearLayout>
1
1
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?