摘要：項目中做到在線壁紙應(yīng)用，在壁紙設(shè)置界面也是參考了主流壁紙應(yīng)用的做法，例如小米，vivo，搜狗等都是采用了類似下圖的界面布局。這里將介紹如何做出類似布局和功能。
主要從事網(wǎng)頁設(shè)計、PC網(wǎng)站建設(shè)（電腦版網(wǎng)站建設(shè)）、wap網(wǎng)站建設(shè)（手機版網(wǎng)站建設(shè)）、響應(yīng)式網(wǎng)站建設(shè)、程序開發(fā)、微網(wǎng)站、小程序設(shè)計等，憑借多年來在互聯(lián)網(wǎng)的打拼，我們在互聯(lián)網(wǎng)網(wǎng)站建設(shè)行業(yè)積累了豐富的成都網(wǎng)站建設(shè)、成都做網(wǎng)站、網(wǎng)絡(luò)營銷經(jīng)驗，集策劃、開發(fā)、設(shè)計、營銷、管理等多方位專業(yè)化運作于一體，具備承接不同規(guī)模與類型的建設(shè)項目的能力。
在圖中，當(dāng)手指滑動滑塊的時候，背景圖片也會跟著左右滑動。圖片很好想到，可以將ImageView放在HorizontalScrollView，當(dāng)圖片的寬度大于屏幕寬度的時候，圖片就可以在HorizontalScrollView中進行左右滑動。接下來就是思考這個滑塊如何實現(xiàn)，當(dāng)時考慮過自定義View的方式，后來某個時刻靈光一閃，發(fā)現(xiàn)系統(tǒng)的音量調(diào)節(jié)界面與其很類似，后來通過查閱相關(guān)資料發(fā)現(xiàn)有個叫SeekBar的控件。但是原生的SeekBar不是長這個樣子，需要你找UI人員做圖，替換系統(tǒng)自帶的圖片就可以了。廢話不多說，直接看布局文件：
<?xml version="1.0" encoding="utf-8"?>
這里，我重寫了HorizontalScrollView，屏蔽其Tonch事件。因為這里僅需要SeekBar來控制圖片的左右滑動。接下來是
MainActivity實現(xiàn)代碼：
重慶分公司
重慶分公司
package com.dighammer.slidewallpaper;
import android.content.Context;
import android.os.Bundle;
import android.os.Handler;
import android.support.v7.app.ActionBarActivity;
import android.view.View;
import android.view.ViewTreeObserver;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.view.WindowManager;
import android.widget.ImageView;
import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;
/**
*
* @author DigHammer
* */
public class MainActivity extends ActionBarActivity implements
OnGlobalLayoutListener, OnSeekBarChangeListener {
private DigHorizontalScrollView mHScrollView;
private SeekBar mSeekBar;
private ImageView mImageView;
Handler mHandler = new Handler();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mHScrollView = (DigHorizontalScrollView) findViewById(R.id.hs);
mSeekBar = (SeekBar) findViewById(R.id.seekBar);
mImageView = (ImageView) findViewById(R.id.iv);
// ImageView圖片設(shè)置完成的監(jiān)聽事件
ViewTreeObserver vto = mImageView.getViewTreeObserver();
vto.addOnGlobalLayoutListener(this);
mSeekBar.setOnSeekBarChangeListener(this);
}
@Override
public void onProgressChanged(SeekBar seekBar, int progress,
boolean fromUser) {
// 圖片隨著SeekBar滑動而滑動
mHScrollView.smoothScrollTo(progress, 0);
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
final int max = Integer.valueOf(mSeekBar.getTag().toString());
// 設(shè)置滑塊永遠居中
if (mSeekBar.getProgress() != max / 2) {
// 加runnable是為了使?jié)L動條平滑滾動
mSeekBar.setProgress(max / 2);
Runnable r = new Runnable() {
@Override
public void run() {
mHScrollView.smoothScrollTo(max / 2, 0);
}
};
mHandler.postDelayed(r, 100);
}
}
@Override
public void onGlobalLayout() {
// TODO Auto-generated method stub
WindowManager wm = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
int wmWidth = wm.getDefaultDisplay().getWidth();
int imageWidth = mImageView.getWidth();
// 比較圖片的寬度和屏幕的寬度
if (imageWidth <= wmWidth) {
mSeekBar.setVisibility(View.GONE);
} else {
mSeekBar.setVisibility(View.VISIBLE);
}
int max = imageWidth - wmWidth;
// 保存max
mSeekBar.setTag(max);
// 設(shè)置sekbar初始位置
mSeekBar.setMax(max);
mSeekBar.setProgress(max / 2);
// 讓圖片居中顯示
mHScrollView.scrollTo(max / 2, 0);
}
}這里主要是兩個監(jiān)聽事件：一個是ImageView圖片顯示完成的監(jiān)聽，另外一個就是SeekBar的滑動監(jiān)聽。
此Demo的代碼還是挺簡單的，但是從中找到了“模仿”的樂趣?。?！
附件Demo下載：點擊打開鏈接
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。
