1. 程式人生 > >android實現圖片+文字輪播(帶文字)

android實現圖片+文字輪播(帶文字)

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height
="160dp" >
<android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="match_parent" /> <LinearLayout android:padding="5dp" android:layout_width="match_parent"
android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:gravity="center_horizontal" android:background="#66000000" android:orientation="vertical" >
<TextView android:id="@+id/textview"
android:layout_width="wrap_content" android:layout_height="wrap_content" android:singleLine="true" android:textColor="#fff" android:textSize="20dp" android:text="天王蓋地虎,天王蓋地虎,天王蓋地虎," />
<LinearLayout android:id="@+id/ll_point" android:gravity="center_horizontal" android:orientation="horizontal" android:layout_marginTop="5dp" android:layout_width="match_parent" android:layout_height="wrap_content" /> </LinearLayout> </RelativeLayout> </RelativeLayout>

MainActivity.java

package com.example.test;

import java.util.ArrayList;
import java.util.List;

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends Activity {
    private ViewPager viewpager;
    private List<ImageView> ivList;
    private String[] descContent;
    private TextView tv;
    private LinearLayout ll_point;
    private int previousPointPosition = 0;
    private boolean isRunning = true;

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

        initViews();
        initData();

        // 自動輪詢播放
        new Thread(new Runnable() {
            @Override
            public void run() {
                while (isRunning) {
                    try {
                        Thread.sleep(2000);
                    } catch (InterruptedException e) {
                        e.printStackTrace();
                    }
                    runOnUiThread(new Runnable() {
                        @Override
                        public void run() {
                            viewpager.setCurrentItem(viewpager.getCurrentItem() + 1);
                        }
                    });
                }
            }
        }).start();
    }

    @Override
    protected void onDestroy() {//按返回鍵,就被摧毀,就停止迴圈
        // TODO Auto-generated method stub
        super.onDestroy();
        isRunning = false;
        System.out.println("-----onDestroy");
    }
    private void initViews() {
        viewpager = (ViewPager) this.findViewById(R.id.viewpager);
        tv = (TextView) this.findViewById(R.id.textview);
        ll_point = (LinearLayout) this.findViewById(R.id.ll_point);
    }

    private void initData() {
        ivList = new ArrayList<ImageView>();
        descContent = new String[] { "窗前明月光", "地上鞋兩雙", "床上狗男女", "其中必有你", "真的有我" };

        int[] imgsId = new int[] { R.drawable.a, R.drawable.b, R.drawable.c,
                R.drawable.d, R.drawable.e };
        for (int i = 0; i < imgsId.length; i++) {
            ImageView iv = new ImageView(this);
            iv.setBackgroundResource(imgsId[i]);
            ivList.add(iv);

            View pointView = new View(this);
            pointView.setBackgroundResource(R.drawable.selector_bg_point);
            pointView.setEnabled(false);
            // 設定圓點的高度和寬度為5
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(
                    15, 15);
            if (i != 0) {
                layoutParams.leftMargin = 10;
            }
            ll_point.addView(pointView, layoutParams);
        }

        tv.setText(descContent[0]);// 設定第一個TextView的值
        ll_point.getChildAt(0).setEnabled(true);// 設定第一個圓點可用

        viewpager.setAdapter(new MyAdapter());
        viewpager.setOnPageChangeListener(new MyPageChangeListener());

        // 從0滑到Integer.MAX_VALUE,需要63年
        int currentPosition = (Integer.MAX_VALUE - 1) / 2 - 3;
        viewpager.setCurrentItem(currentPosition);// Integer.MAX_VALUE的值:2147483647

    }

    class MyAdapter extends PagerAdapter {

        @Override
        public int getCount() {
            return Integer.MAX_VALUE;// Integer.MAX_VALUE的值:2147483647
        }

        @Override
        public boolean isViewFromObject(View view, Object obj) {
            return view == obj;
        }

        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            System.out.println("---position:" + position);
            ImageView iv = ivList.get(position % 5);
            ((ViewPager) container).addView(iv);
            return iv;
        }

        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            ((ViewPager) container).removeView((View) object);
        }
    }

    class MyPageChangeListener implements OnPageChangeListener {
        @Override
        public void onPageScrollStateChanged(int arg0) {
            // TODO Auto-generated method stub

        }

        @Override
        public void onPageScrolled(int arg0, float arg1, int arg2) {

        }

        @Override
        public void onPageSelected(int position) {
            int newPosition = position % 5;
            tv.setText(descContent[newPosition]);

            ll_point.getChildAt(previousPointPosition).setEnabled(false);
            ll_point.getChildAt(newPosition).setEnabled(true);

            previousPointPosition = newPosition;
        }

    }
}

實驗截圖:
這裡寫圖片描述

相關推薦

android實現圖片+文字文字

activity_main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.

Android使用ViewPager實現圖片

一.概述 在現在的Android專案中,首頁圖片輪播是隨處可見的,今天我們看看如何實現,先看效果圖: 二.實現 先給大家看看最簡單的佈局檔案 <LinearLayout xmlns:android="http://schemas.and

js實現圖片3D效果收藏

3D的圖片輪播效果很炫,寫到這裡只是為了不丟程式碼,不為別的。效果預覽:html程式碼:<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <t

jQuery實現圖片左右

https src play 頁面 body block relative over 圖片 <!DOCTYPE html> <html> <head> <title></title> <st

實現圖片效果

parse ice mov ppi oos image black new app 實現圖片的輪播效果 1.顯示頁面:index.jsp <%@ page language="java" contentType="text/html; charset=UTF-8"

Android實現ViewPager廣告控制元件在不同解析度的螢幕下高度自適應

    這篇文章首先我自己感覺,有點兒個人化的味道~為什麼這麼說? 因為很遺憾,我這裡實現 “ ViewPager寬度鋪滿、高度自適應 ” 的方法又和網上其他的不太一樣。雖然我依然是隻寫了幾句程式碼來實現這個要求,依然沒有用什麼自定義元件~可是這次和之前不一樣,這次不是簡單

iOS開發之三個Button實現圖片無限(參考手機淘寶,Swift版)

這兩天使用Reveal工具檢視"手機淘寶"App的UI層次時,發現其圖片輪播使用了三個UIButton的複用來實現的圖片迴圈無縫滾動。於是乎就有了今天這篇部落格,看到“手機淘寶”這個幻燈片的UI層級時,就想要動手使用三個Button來實現一下,當然本篇部落格使用是Swift語言,思路就是使用三個Button進

用bootstrap實現圖片

<!--圖片輪播--> <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> <!--輪播圖片的提示點--> <ol class="carousel-indic

使用Swiper開發移動端頁面,輕鬆實現圖片

swiper 1.主要包含模組: swiper:指滑動、切換(整個滑動物件,有時特指滑塊釋放後仍然正向移動直到貼合邊緣的過程(過渡)) container:指容器(swiper的容器裡面包括滑動快(slide)的集合(wrapper)、分頁器(pagination)、前進

jquery圖片,點選左右按鈕,可控制是否自動播放,是否迴圈自寫

<!DOCTYPE html> <html lang="zh-CN"> <head>     <meta charset="UTF-8">     <title>輪播</title>     <

無縫框架版

put this top ole javascrip posit style .class ack 無縫輪播(框架版) <style type=‘text/css‘> *{ margin:0; padding:0;}

spring boot使用nginx和ftp伺服器實現圖片上傳下載windows server

本人使用的springboot為1.5.6版本<parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-pa

使用系統提供的AVFoundation 實現二維碼掃描動畫

注意這裡的掃描必須真機測試 模擬器上是看不出來效果的 #import "ViewController.h" #import <AVFoundation/AVFoundation.h> @interface ViewController ()<AVCa

Bootstrap V3版本滾動幻燈片外掛使用

首頁大屏滾動幻燈片是網站常用表現手法,尤其企業展示型網站使用最多,下面針對Bootstrap V3版本幻燈片呼叫做詳細分解記錄,以便後期查閱。 一、首先引用Bootstrap原始碼的CSS和JS與相關的JQuery版本檔案(V3版本匹配的JQ檔案版本為1.9版本系列)。

Bootstrap外掛——Carousel.js

         這一篇我們來學習一下bootstrap的輪播外掛Carousel.js,我相信大家對於輪播已經熟悉的不能再熟悉了,基本上我們任意開啟一個網站都會有輪播的元素。在以前需要我們通過js

android自定義環形統計圖動畫

一、測試截圖 二、實現原理  package com.freedomanlib; import java.util.Timer; import java.util.TimerTask; import android.annotation.SuppressLint;

Android自制圖片的三級快取程式碼+講解

Android的圖片三級快取機制 首先 圖片的三計劃快取的概念 泛指的是 -記憶體快取 -本地快取 -網路快取 記憶體快取的概念: 應用程式在執行時 WindowMeanger會分配給 應用 相應的執行時記憶體 執行是記憶體的大小根據and

JS原生JS篇

接著上一篇,我接下來寫關於JS的部分,我會按照我當時的思路一步一步的寫,在最後附上全部的程式碼 一開始我打算寫最簡單的圖片切換功能,怎麼寫呢?當我們點選左右箭頭的時候是用改變left的值,有了思路就很好寫了 //首先我們要獲取我們需要的屬性和id

使用Qt5+CMake實現圖片的區域選擇附原始碼

近期研發涉及到了圖片的區域選擇,找來一些資料一直不能很滿意,所以自己實現了一個。 實現步驟如下。原始碼可以點選ImageAOI獲取。 如下資料來自原始碼的README。 ImageAOI (XLabel): AOI Selection Based on Qt5 Dependency Qt >= 5.0

jquery實現圖片向左慢慢滑鼠懸停圖片停止

window.onload=function(){ function $(id){ return document.getElementById(id); } var num=0; function autopl