仿照網易云音樂界面

仿照網易云音樂界面
 


仿照網易云音樂界面 ，頁面UI實現的聽不錯的，學習ui的朋友可以下載下來研究研究，
項目大體框架，由ViewPager和TabContentPagerAdapter實現頂部的左右滑動切換view.
右側滑動DrawerLayout 實現左右滑動。

項目大體實現：

package me.xoder.neteasy.activity;

import android.app.ActionBar;
import android.app.FragmentTransaction;
import android.content.res.TypedArray;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.util.Log;
import android.view.Gravity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ImageView;
import java.lang.reflect.Method;
import me.xoder.neteasy.R;
import me.xoder.neteasy.adapter.TabContentPagerAdapter;
public class MainActivity extends FragmentActivity {
    private ViewPager mViewPager;
    private DrawerLayout slideMenu;
    private ActionBar actionBar;

private TabContentPagerAdapter mPagerAdapter;

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

    actionBar = getActionBar();
    mViewPager = (ViewPager) findViewById(R.id.view_pager);
    slideMenu = (DrawerLayout) findViewById(R.id.slide_menu);

    slideMenu.setScrimColor(Color.argb(50, 0, 0, 0));

    mPagerAdapter = new TabContentPagerAdapter(getSupportFragmentManager());
    mViewPager.setAdapter(mPagerAdapter);
    mViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
        @Override
        public void onPageSelected(int position) {
            actionBar.setSelectedNavigationItem(position);
        }
    });

    actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    ActionBar.TabListener tabListener = new ActionBar.TabListener() {
        @Override
        public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
            mViewPager.setCurrentItem(tab.getPosition());
        }

        @Override
        public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {

        }

        @Override
        public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {

        }
    };

    TypedArray tabIconIds = getResources().obtainTypedArray(R.array.actionbar_icons);
    for (int i = 0; i < 3; i++) {
        View view = getLayoutInflater().inflate(R.layout.actionbar_tab, null);
        ImageView tabIcon = (ImageView) view.findViewById(R.id.actionbar_tab_icon);
        tabIcon.setImageResource(tabIconIds.getResourceId(i, -1));

        actionBar.addTab(actionBar.newTab().setCustomView(view).setTabListener(tabListener));
    }

    enableEmbeddedTabs(actionBar);
}

/**
 * 在actionbar中內嵌Tab
 *
 * @param actionBar actionbar
 */
private void enableEmbeddedTabs(android.app.ActionBar actionBar) {
    try {
        Method setHasEmbeddedTabsMethod = actionBar.getClass().getDeclaredMethod("setHasEmbeddedTabs", boolean.class);
        setHasEmbeddedTabsMethod.setAccessible(true);
        setHasEmbeddedTabsMethod.invoke(actionBar, true);
    } catch (Exception e) {
        Log.v("enableEmbeddedTabs", e.getMessage().toString());
    }
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);

    return true;
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    int id = item.getItemId();

    if (id == R.id.action_search) {
        // TODO: 2015-07-25 搜索界面         
    } else if (id == R.id.action_menu) {
        // TODO: 2015-07-25 菜單選擇
        if (slideMenu.isDrawerOpen(Gravity.RIGHT)) {
            slideMenu.closeDrawer(Gravity.RIGHT);
        } else {
            slideMenu.openDrawer(Gravity.RIGHT);
        }
    }

    return true;
}

}
//////////////////
package me.xoder.neteasy.activity;
import android.annotation.TargetApi;
import android.app.ActionBar;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTransaction;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.FrameLayout;
import me.xoder.neteasy.R;
import me.xoder.neteasy.fragment.discover.fm.CoverFragment;
import me.xoder.neteasy.fragment.discover.fm.LyricFragment;
/**

Created by alex.lee on 2015-07-29.
*/
public class PersonalFMActivity extends FragmentActivity {
 private ActionBar actionBar;
private Fragment fgTo;
 private Fragment fgCover;
 private Fragment fgLyric;
 private boolean fgFlag = false;
private FrameLayout frameContainer;
@TargetApi(Build.VERSION_CODES.JELLY_BEAN_MR2)
 @Override
 protected void onCreate(Bundle savedInstanceState) {

 super.onCreate(savedInstanceState);
 setContentView(R.layout.activity_personal_fm);

 actionBar = getActionBar();
 actionBar.setTitle("私人FM");
 actionBar.setDisplayShowTitleEnabled(true);
 actionBar.setDisplayUseLogoEnabled(true);
 actionBar.setDisplayHomeAsUpEnabled(true);
 actionBar.setDisplayShowHomeEnabled(true);
 actionBar.setLogo(R.drawable.actionbar_logo);
 actionBar.setHomeAsUpIndicator(R.drawable.rdi_icn_arr);

 if (fgCover == null) {
     fgCover = new CoverFragment();
 }
 if (!fgCover.isAdded()) {
     getSupportFragmentManager().beginTransaction().add(R.id.frame_fm_container, fgCover, CoverFragment.class.getSimpleName()).commit();
 }
 fgTo = fgCover;

 frameContainer = (FrameLayout) findViewById(R.id.frame_fm_container);
 frameContainer.setOnClickListener(new View.OnClickListener() {
     @Override
     public void onClick(View v) {
         if (fgFlag) {
             if (fgCover == null) {
                 fgCover = new CoverFragment();
             }
             switchFragment(fgTo, fgCover);
         } else {
             if (fgLyric == null) {
                 fgLyric = new LyricFragment();
             }
             switchFragment(fgTo, fgLyric);
         }
         fgFlag = !fgFlag;
     }
 });

}
@Override
 public boolean onCreateOptionsMenu(Menu menu) {

 getMenuInflater().inflate(R.menu.menu_personal_fm, menu);
 return true;

}
@Override
 public boolean onOptionsItemSelected(MenuItem item) {

 int id = item.getItemId();

 switch (id) {
     case android.R.id.home:
         finish();
         break;
 }

 return true;

}
public void switchFragment(Fragment from, Fragment to) {

 if (from == null || to == null || from == to) {
     return;
 }

 FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
 transaction.setCustomAnimations(R.anim.abc_fade_in, R.anim.abc_fade_out);

 if (!to.isAdded()) {
     // 隱藏當前的fragment，add下一個到Activity中
     transaction.hide(from).add(R.id.frame_fm_container, to).commit();
 } else {
     // 隱藏當前的fragment，顯示下一個
     transaction.hide(from).show(to).commit();
 }

 fgTo = to;

}
}</pre>

文章來源《IT藍豹》android特效分享