微信6.0主界面

1.效果图

2.知识点

(1)ActionBar的使用

(2)底部渐变色

3.actionbar

(1)menu /main.xml

                 http://www.2cto.com/kf/201503/380578.html

4.自定义view,底部渐变图标

(1).自定义View步骤

(2)attr.xml

1.ChangeColorIconWithText

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.Xfermode;
import android.graphics.drawable.BitmapDrawable;
import android.os.Bundle;
import android.os.Looper;
import android.os.Parcelable;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;
/*
0.初始化变量
1.获取测量的范围    onmeause();
**/
public class ChangeColorIconWithText extends View
{private int mColor = 0xFF45C01A;private Bitmap mIconBitmap;private String mText = "微信";private int mTextSize = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 12, getResources().getDisplayMetrics());private Canvas mCanvas;private Bitmap mBitmap;private Paint mPaint;private float mAlpha;//透明度private Rect mIconRect;private Rect mTextBound;private Paint mTextPaint;public ChangeColorIconWithText(Context context){this(context, null);}public ChangeColorIconWithText(Context context, AttributeSet attrs){this(context, attrs, 0);}/*** 获取自定义属性的值* * @param context* @param attrs* @param defStyleAttr*/public ChangeColorIconWithText(Context context, AttributeSet attrs,int defStyleAttr){super(context, attrs, defStyleAttr);TypedArray a = context.obtainStyledAttributes(attrs,R.styleable.ChangeColorIconWithText);int n = a.getIndexCount();for (int i = 0; i < n; i++){int attr = a.getIndex(i);switch (attr){case R.styleable.ChangeColorIconWithText_icon:BitmapDrawable drawable = (BitmapDrawable) a.getDrawable(attr);mIconBitmap = drawable.getBitmap();break;case R.styleable.ChangeColorIconWithText_color:mColor = a.getColor(attr, 0xFF45C01A);break;case R.styleable.ChangeColorIconWithText_text:mText = a.getString(attr);break;case R.styleable.ChangeColorIconWithText_text_size:mTextSize = (int) a.getDimension(attr, TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 12,getResources().getDisplayMetrics()));break;}}a.recycle();//初始化变量mTextBound = new Rect();mTextPaint = new Paint();mTextPaint.setTextSize(mTextSize);mTextPaint.setColor(0Xff555555);//测量字的范围，mTextBound包含字的宽高mTextPaint.getTextBounds(mText, 0, mText.length(), mTextBound);  }@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){super.onMeasure(widthMeasureSpec, heightMeasureSpec);//icon的宽度：int iconWidth = Math.min(getMeasuredWidth() - getPaddingLeft()- getPaddingRight(), getMeasuredHeight() - getPaddingTop()- getPaddingBottom() - mTextBound.height());int left = getMeasuredWidth() / 2 - iconWidth / 2;int top = getMeasuredHeight() / 2 - (mTextBound.height() + iconWidth)/ 2;//获得绘制的范围mIconRect = new Rect(left, top, left + iconWidth, top + iconWidth);}@Overrideprotected void onDraw(Canvas canvas){//绘制图片canvas.drawBitmap(mIconBitmap, null, mIconRect, null);int alpha = (int) Math.ceil(255 * mAlpha);// 内存去准备mBitmap , setAlpha , 纯色 ，xfermode ， 图标setupTargetBitmap(alpha);// 1、绘制原文本 ； 2、绘制变色的文本drawSourceText(canvas, alpha);drawTargetText(canvas, alpha);canvas.drawBitmap(mBitmap, 0, 0, null);}/*** 绘制变色的文本* * @param canvas* @param alpha*/private void drawTargetText(Canvas canvas, int alpha){mTextPaint.setColor(mColor);mTextPaint.setAlpha(alpha);int x = getMeasuredWidth() / 2 - mTextBound.width() / 2;int y = mIconRect.bottom + mTextBound.height();canvas.drawText(mText, x, y, mTextPaint);}/*** 绘制原文本* * @param canvas* @param alpha*/private void drawSourceText(Canvas canvas, int alpha){mTextPaint.setColor(0xff333333);mTextPaint.setAlpha(255 - alpha);int x = getMeasuredWidth() / 2 - mTextBound.width() / 2;int y = mIconRect.bottom + mTextBound.height();canvas.drawText(mText, x, y, mTextPaint);}/*** 在内存中绘制可变色的Icon*/private void setupTargetBitmap(int alpha){mBitmap = Bitmap.createBitmap(getMeasuredWidth(), getMeasuredHeight(),Config.ARGB_8888);mCanvas = new Canvas(mBitmap);mPaint = new Paint();mPaint.setColor(mColor);mPaint.setAntiAlias(true);mPaint.setDither(true);mPaint.setAlpha(alpha);mCanvas.drawRect(mIconRect, mPaint);mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));mPaint.setAlpha(255);mCanvas.drawBitmap(mIconBitmap, null, mIconRect, mPaint);}private static final String INSTANCE_STATUS = "instance_status";private static final String STATUS_ALPHA = "status_alpha";@Overrideprotected Parcelable onSaveInstanceState(){Bundle bundle = new Bundle();bundle.putParcelable(INSTANCE_STATUS, super.onSaveInstanceState());bundle.putFloat(STATUS_ALPHA, mAlpha);return bundle;}@Overrideprotected void onRestoreInstanceState(Parcelable state){if (state instanceof Bundle){Bundle bundle = (Bundle) state;mAlpha = bundle.getFloat(STATUS_ALPHA);super.onRestoreInstanceState(bundle.getParcelable(INSTANCE_STATUS));return;}super.onRestoreInstanceState(state);}public void setIconAlpha(float alpha){this.mAlpha = alpha;invalidateView();}/*** 重绘*/private void invalidateView(){if (Looper.getMainLooper() == Looper.myLooper()){invalidate();} else{postInvalidate();}}}

2.布局

3.MainActivity

import java.lang.reflect.Field;
import java.lang.reflect.Method;
import java.util.ArrayList;
import java.util.List;import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v4.view.ViewPager.OnPageChangeListener;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewConfiguration;
import android.view.Window;public class MainActivity extends FragmentActivity implements OnClickListener,OnPageChangeListener
{private ViewPager mViewPager;private List mTabs = new ArrayList();private String[] mTitles = new String[]{ "First Fragment !", "Second Fragment !", "Third Fragment !","Fourth Fragment !" };private FragmentPagerAdapter mAdapter;private List mTabIndicators = new ArrayList();@Overrideprotected void onCreate(Bundle savedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);setOverflowButtonAlways();getActionBar().setDisplayShowHomeEnabled(false);initView();initDatas();mViewPager.setAdapter(mAdapter);initEvent();}/*** 初始化所有事件*/private void initEvent(){mViewPager.setOnPageChangeListener(this);}private void initDatas(){for (String title : mTitles){TabFragment tabFragment = new TabFragment();Bundle bundle = new Bundle();bundle.putString(TabFragment.TITLE, title);tabFragment.setArguments(bundle);mTabs.add(tabFragment);}mAdapter = new FragmentPagerAdapter(getSupportFragmentManager()){@Overridepublic int getCount(){return mTabs.size();}@Overridepublic Fragment getItem(int position){return mTabs.get(position);}};}private void initView(){mViewPager = (ViewPager) findViewById(R.id.id_viewpager);ChangeColorIconWithText one = (ChangeColorIconWithText) findViewById(R.id.id_indicator_one);mTabIndicators.add(one);ChangeColorIconWithText two = (ChangeColorIconWithText) findViewById(R.id.id_indicator_two);mTabIndicators.add(two);ChangeColorIconWithText three = (ChangeColorIconWithText) findViewById(R.id.id_indicator_three);mTabIndicators.add(three);ChangeColorIconWithText four = (ChangeColorIconWithText) findViewById(R.id.id_indicator_four);mTabIndicators.add(four);one.setOnClickListener(this);two.setOnClickListener(this);three.setOnClickListener(this);four.setOnClickListener(this);one.setIconAlpha(1.0f);}@Overridepublic boolean onCreateOptionsMenu(Menu menu){getMenuInflater().inflate(R.menu.main, menu);return true;}private void setOverflowButtonAlways(){try{ViewConfiguration config = ViewConfiguration.get(this);Field menuKey = ViewConfiguration.class.getDeclaredField("sHasPermanentMenuKey");menuKey.setAccessible(true);menuKey.setBoolean(config, false);} catch (Exception e){e.printStackTrace();}}/*** 设置menu显示icon*/@Overridepublic boolean onMenuOpened(int featureId, Menu menu){if (featureId == Window.FEATURE_ACTION_BAR && menu != null){if (menu.getClass().getSimpleName().equals("MenuBuilder")){try{Method m = menu.getClass().getDeclaredMethod("setOptionalIconsVisible", Boolean.TYPE);m.setAccessible(true);m.invoke(menu, true);} catch (Exception e){e.printStackTrace();}}}return super.onMenuOpened(featureId, menu);}@Overridepublic void onClick(View v){clickTab(v);}/*** 点击Tab按钮* * @param v*/private void clickTab(View v){resetOtherTabs();switch (v.getId()){case R.id.id_indicator_one:mTabIndicators.get(0).setIconAlpha(1.0f);mViewPager.setCurrentItem(0, false);break;case R.id.id_indicator_two:mTabIndicators.get(1).setIconAlpha(1.0f);mViewPager.setCurrentItem(1, false);break;case R.id.id_indicator_three:mTabIndicators.get(2).setIconAlpha(1.0f);mViewPager.setCurrentItem(2, false);break;case R.id.id_indicator_four:mTabIndicators.get(3).setIconAlpha(1.0f);mViewPager.setCurrentItem(3, false);break;}}/*** 重置其他的TabIndicator的颜色*/private void resetOtherTabs(){for (int i = 0; i < mTabIndicators.size(); i++){mTabIndicators.get(i).setIconAlpha(0);}}@Overridepublic void onPageScrolled(int position, float positionOffset,int positionOffsetPixels){// Log.e("TAG", "position = " + position + " ,positionOffset =  "// + positionOffset);if (positionOffset > 0){ChangeColorIconWithText left = mTabIndicators.get(position);ChangeColorIconWithText right = mTabIndicators.get(position + 1);left.setIconAlpha(1 - positionOffset);right.setIconAlpha(positionOffset);}}@Overridepublic void onPageSelected(int position){// TODO Auto-generated method stub}@Overridepublic void onPageScrollStateChanged(int state){// TODO Auto-generated method stub}}

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！