今天开始做一个音乐播放器的欢迎界面，这是第一天，也是博主第一次发博客，写的不好，请亲喷。还有若某些地方写得不好，有错误或有更方便的实现方法，请提出，不胜感激。由于博主才大二，刚接触不久，也希望大神们多多照顾哟。呵呵~现在开始吧。先上效果图。 晕 效果图传不上来。手机渣，一直root失败，无法截屏，说声抱歉。大致是这样个效果。用ViewPager做的滑动效果。最底下还有小点，在不同的界面，小点的颜色不一样。在最后面一个Button,用于进入主界面。先是去掉标题和全屏显示。requestWindowFeature(Window.FEATURE_NO_TITLE);//去掉标题
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
//这里注意下，必须把上面2句放在setcontentview之前，不然会报错 然后在login.xml中，写出ViewPager <android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" >
</android.support.v4.view.ViewPager> 这个login.xml是和欢迎界面LogIn匹配的。所以 setContentView(R.layout.login); 要实现3张图片，滑动的话，除了一个主布login.xml外，还写了3个xml，用于显示3张图片。分别是view1.xml,view2.xml,view3.xml每个xml中都只有一个ImageView控件 <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/iv1"
/> 现在布局文件好了，继续在LogIn的OnCreat()中操作。//先声明ViewPagerViewPager viempager=(ViewPager)this.findViewById(R.id.viewpager);//用LayoutInflater加载布局xml
LayoutInflater li=LayoutInflater.from(this);
View view1=li.inflate(R.layout.view1, null);
View view2=li.inflate(R.layout.view2, null);
View view3=li.inflate(R.layout.view3, null);/动态设置view里面的ImageView
//先声明
ImageView iv1=(ImageView)view1.findViewById(R.id.iv1);
ImageView iv2=(ImageView)view2.findViewById(R.id.iv2);
ImageView iv3=(ImageView)view3.findViewById(R.id.iv3);
//再设置
iv1.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.guide1));
iv2.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.guide2));
iv3.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.guide3));复制代码 现在已经获得了3个布局文件对象，之后要把它存起来//用ArrayList来存放View
final ArrayList<View> views=new ArrayList<View>();
views.add(view1);
views.add(view2);
views.add(view3); 然后就是为ViewPager加适配器了。要重下个方法，分别是isViewFromObject（），getCount()， destroyItem（）， instantiateItem（）。
复制代码
PagerAdapter pageradapter=new PagerAdapter() {
//重写的方法
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0==arg1;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return views.size();
}
@Override
public void destroyItem(View container, int position, Object object) {
((ViewPager)container).removeView(views.get(position));
}
@Override
public Object instantiateItem(View container, int position) {
((ViewPager)container).addView(views.get(position));
return views.get(position);
}
};复制代码 最后//绑定适配器
viempager.setAdapter(pageradapter); 那么3张图片的连续滑动的效果基本做成了。但是接下来，我在我手机上调试，发现图片是无法匹配屏幕的，无法全屏显示，就算所有控件的都设为fill_parent。手机的分辨率不同，无法适应图片，要是在平板上运行，那就非常小。虽然android中有很多drawable，但我这中PS烂的，觉得代价太大了。所以接下来，用代码改变了图片的大小和当前手机分辨率一样。首先 获取手机的分辨率。//获取屏幕分辨率
DisplayMetrics dm=new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
int srceenw=dm.widthPixels;//宽
int srceenh=dm.heightPixels;//高 然后用Bitmap.createBitmap(),重新创建图片其函数为
复制代码
//改变图片函数
public static Bitmap resizeBitmap(Bitmap bitmap, int w, int h) {
if (bitmap != null) {
int width = bitmap.getWidth();
int height = bitmap.getHeight();
int newWidth = w;
int newHeight = h;
float scaleWidth = ((float) newWidth) / width;
float scaleHeight = ((float) newHeight) / height;
Matrix matrix = new Matrix();
matrix.postScale(scaleWidth, scaleHeight);
Bitmap resizedBitmap = Bitmap.createBitmap(bitmap, 0, 0, width,
height, matrix, true);
return resizedBitmap;
} else {
return null;
}复制代码 只要把图片和想要的大小传进去就行。所以先导入资源
复制代码
Bitmap log1=BitmapFactory.decodeResource(getResources(), R.drawable.guide1);//guide1就是那三张图片
Bitmap log2=BitmapFactory.decodeResource(getResources(), R.drawable.guide2);
Bitmap log3=BitmapFactory.decodeResource(getResources(), R.drawable.guide3);
//改变图片大小函数
Bitmap nlog1=resizeBitmap(log1, srceenw, srceenh);
Bitmap nlog2=resizeBitmap(log2, srceenw, srceenh);
Bitmap nlog3=resizeBitmap(log3, srceenw, srceenh);复制代码 现在已经得到想要的图片大小了讲上面的ImageView的显示图片重新改了换成nlog1,nlog2,nlog3
复制代码
/动态设置view里面的ImageView
//先声明
ImageView iv1=(ImageView)view1.findViewById(R.id.iv1);
ImageView iv2=(ImageView)view2.findViewById(R.id.iv2);
ImageView iv3=(ImageView)view3.findViewById(R.id.iv3);
//再设置
iv1.setImageBitmap(nlog1);
iv2.setImageBitmap(nlog2);
iv3.setImageBitmap(nlog3);复制代码 这样就实现全屏了。最后我们来处理最底下的小圆点。在login.xml中
复制代码
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" >
</android.support.v4.view.ViewPager> <LinearLayout
android:id="@+id/point"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10.0dip"
android:orientation="horizontal">android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:clickable="true"
android:padding="15.0dip"
android:src="@drawable/point"/> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:clickable="true"
android:padding="15.0dip"
android:src="@drawable/point"/> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:clickable="true"
android:padding="15.0dip"
android:src="@drawable/point"/>
</LinearLayout>复制代码 这里注意了，有个@drawable/point，这个是什么呢？这是写的一个drawable的xml，point.xml<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_enabled="true" android:drawable="@drawable/guide_dot_normal" /> <item android:state_enabled="false" android:drawable="@drawable/guide_dot_selected" /></selector> 可以看出，当状态为true时，dot小圆点的显示为normal，及黑色。当为false，dot显示的是白色,图片为guide_dot_selected；接下了，这么实现上面的效果呢？当然要判断当前的页面是哪个.当时第一个页面，第一个原点是白色的，其他是黑色的。所以我们要判断当前页面。需要在当前Activity中implements OnPageChangeListener（）。重新3个方法，只需用到一个 onPageSelected（）
复制代码
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
@Override
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
//当被选中
setCurrentDot(arg0); //这里的就是根据当前页面，设置dot小圆点。
}复制代码 接下来实现小圆点的具体实现
复制代码
// 底部小点图片
private ImageView[] dots;
// 记录当前选中位置
private int currentIndex; private void initDots() {
LinearLayout point = (LinearLayout) findViewById(R.id.point); //获取point;
dots = new ImageView[3];
// 循环取得小点图片
for (int i = 0; i < 3; i++) {
dots[i] = (ImageView) point.getChildAt(i); //这个函数是从point中根据编号读相应的ImageView
dots[i].setEnabled(true);// 都设为黑色
}
currentIndex = 0;
dots[currentIndex].setEnabled(false);// 设置为白色，即选中状态
}
private void setCurrentDot(int position) {
dots[position].setEnabled(false);
dots[currentIndex].setEnabled(true);
currentIndex = position;
} 复制代码 在viempager.setAdapter(pageradapter);后 /绑定回调
viempager.setOnPageChangeListener(this);
//初始化小点
initDots(); 这样带有移动效果的小圆点就完成了。然后就是在第三个View中添加的个按钮，欢迎界面的完成了。 这是开发这播放器的第一天，之后会随时把最新的功能和效果，发表出来。博主经验少，若有好的意见，希望广大博友提出来。就这样了，下次见。音乐播放器 ViewPager音乐播放器ViewPager
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
//这里注意下，必须把上面2句放在setcontentview之前，不然会报错 然后在login.xml中，写出ViewPager <android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" >
</android.support.v4.view.ViewPager> 这个login.xml是和欢迎界面LogIn匹配的。所以 setContentView(R.layout.login); 要实现3张图片，滑动的话，除了一个主布login.xml外，还写了3个xml，用于显示3张图片。分别是view1.xml,view2.xml,view3.xml每个xml中都只有一个ImageView控件 <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/iv1"
/> 现在布局文件好了，继续在LogIn的OnCreat()中操作。//先声明ViewPagerViewPager viempager=(ViewPager)this.findViewById(R.id.viewpager);//用LayoutInflater加载布局xml
LayoutInflater li=LayoutInflater.from(this);
View view1=li.inflate(R.layout.view1, null);
View view2=li.inflate(R.layout.view2, null);
View view3=li.inflate(R.layout.view3, null);/动态设置view里面的ImageView
//先声明
ImageView iv1=(ImageView)view1.findViewById(R.id.iv1);
ImageView iv2=(ImageView)view2.findViewById(R.id.iv2);
ImageView iv3=(ImageView)view3.findViewById(R.id.iv3);
//再设置
iv1.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.guide1));
iv2.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.guide2));
iv3.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.guide3));复制代码 现在已经获得了3个布局文件对象，之后要把它存起来//用ArrayList来存放View
final ArrayList<View> views=new ArrayList<View>();
views.add(view1);
views.add(view2);
views.add(view3); 然后就是为ViewPager加适配器了。要重下个方法，分别是isViewFromObject（），getCount()， destroyItem（）， instantiateItem（）。
复制代码
PagerAdapter pageradapter=new PagerAdapter() {
//重写的方法
@Override
public boolean isViewFromObject(View arg0, Object arg1) {
// TODO Auto-generated method stub
return arg0==arg1;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return views.size();
}
@Override
public void destroyItem(View container, int position, Object object) {
((ViewPager)container).removeView(views.get(position));
}
@Override
public Object instantiateItem(View container, int position) {
((ViewPager)container).addView(views.get(position));
return views.get(position);
}
};复制代码 最后//绑定适配器
viempager.setAdapter(pageradapter); 那么3张图片的连续滑动的效果基本做成了。但是接下来，我在我手机上调试，发现图片是无法匹配屏幕的，无法全屏显示，就算所有控件的都设为fill_parent。手机的分辨率不同，无法适应图片，要是在平板上运行，那就非常小。虽然android中有很多drawable，但我这中PS烂的，觉得代价太大了。所以接下来，用代码改变了图片的大小和当前手机分辨率一样。首先 获取手机的分辨率。//获取屏幕分辨率
DisplayMetrics dm=new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
int srceenw=dm.widthPixels;//宽
int srceenh=dm.heightPixels;//高 然后用Bitmap.createBitmap(),重新创建图片其函数为
复制代码
//改变图片函数
public static Bitmap resizeBitmap(Bitmap bitmap, int w, int h) {
if (bitmap != null) {
int width = bitmap.getWidth();
int height = bitmap.getHeight();
int newWidth = w;
int newHeight = h;
float scaleWidth = ((float) newWidth) / width;
float scaleHeight = ((float) newHeight) / height;
Matrix matrix = new Matrix();
matrix.postScale(scaleWidth, scaleHeight);
Bitmap resizedBitmap = Bitmap.createBitmap(bitmap, 0, 0, width,
height, matrix, true);
return resizedBitmap;
} else {
return null;
}复制代码 只要把图片和想要的大小传进去就行。所以先导入资源
复制代码
Bitmap log1=BitmapFactory.decodeResource(getResources(), R.drawable.guide1);//guide1就是那三张图片
Bitmap log2=BitmapFactory.decodeResource(getResources(), R.drawable.guide2);
Bitmap log3=BitmapFactory.decodeResource(getResources(), R.drawable.guide3);
//改变图片大小函数
Bitmap nlog1=resizeBitmap(log1, srceenw, srceenh);
Bitmap nlog2=resizeBitmap(log2, srceenw, srceenh);
Bitmap nlog3=resizeBitmap(log3, srceenw, srceenh);复制代码 现在已经得到想要的图片大小了讲上面的ImageView的显示图片重新改了换成nlog1,nlog2,nlog3
复制代码
/动态设置view里面的ImageView
//先声明
ImageView iv1=(ImageView)view1.findViewById(R.id.iv1);
ImageView iv2=(ImageView)view2.findViewById(R.id.iv2);
ImageView iv3=(ImageView)view3.findViewById(R.id.iv3);
//再设置
iv1.setImageBitmap(nlog1);
iv2.setImageBitmap(nlog2);
iv3.setImageBitmap(nlog3);复制代码 这样就实现全屏了。最后我们来处理最底下的小圆点。在login.xml中
复制代码
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" >
</android.support.v4.view.ViewPager> <LinearLayout
android:id="@+id/point"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="10.0dip"
android:orientation="horizontal">android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:clickable="true"
android:padding="15.0dip"
android:src="@drawable/point"/> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:clickable="true"
android:padding="15.0dip"
android:src="@drawable/point"/> <ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:clickable="true"
android:padding="15.0dip"
android:src="@drawable/point"/>
</LinearLayout>复制代码 这里注意了，有个@drawable/point，这个是什么呢？这是写的一个drawable的xml，point.xml<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_enabled="true" android:drawable="@drawable/guide_dot_normal" /> <item android:state_enabled="false" android:drawable="@drawable/guide_dot_selected" /></selector> 可以看出，当状态为true时，dot小圆点的显示为normal，及黑色。当为false，dot显示的是白色,图片为guide_dot_selected；接下了，这么实现上面的效果呢？当然要判断当前的页面是哪个.当时第一个页面，第一个原点是白色的，其他是黑色的。所以我们要判断当前页面。需要在当前Activity中implements OnPageChangeListener（）。重新3个方法，只需用到一个 onPageSelected（）
复制代码
@Override
public void onPageScrollStateChanged(int arg0) {
// TODO Auto-generated method stub
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
// TODO Auto-generated method stub
}
@Override
public void onPageSelected(int arg0) {
// TODO Auto-generated method stub
//当被选中
setCurrentDot(arg0); //这里的就是根据当前页面，设置dot小圆点。
}复制代码 接下来实现小圆点的具体实现
复制代码
// 底部小点图片
private ImageView[] dots;
// 记录当前选中位置
private int currentIndex; private void initDots() {
LinearLayout point = (LinearLayout) findViewById(R.id.point); //获取point;
dots = new ImageView[3];
// 循环取得小点图片
for (int i = 0; i < 3; i++) {
dots[i] = (ImageView) point.getChildAt(i); //这个函数是从point中根据编号读相应的ImageView
dots[i].setEnabled(true);// 都设为黑色
}
currentIndex = 0;
dots[currentIndex].setEnabled(false);// 设置为白色，即选中状态
}
private void setCurrentDot(int position) {
dots[position].setEnabled(false);
dots[currentIndex].setEnabled(true);
currentIndex = position;
} 复制代码 在viempager.setAdapter(pageradapter);后 /绑定回调
viempager.setOnPageChangeListener(this);
//初始化小点
initDots(); 这样带有移动效果的小圆点就完成了。然后就是在第三个View中添加的个按钮，欢迎界面的完成了。 这是开发这播放器的第一天，之后会随时把最新的功能和效果，发表出来。博主经验少，若有好的意见，希望广大博友提出来。就这样了，下次见。音乐播放器 ViewPager音乐播放器ViewPager
解决方案 »
免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货