yichen67 阅读(1424) 评论(0)

 
仿照网易云音乐界面 android特效
 
仿照网易云音乐界面 ,页面UI实现的听不错的,学习ui的朋友可以下载下来研究研究,
项目大体框架,由ViewPager和TabContentPagerAdapter实现顶部的左右滑动切换view.
右侧滑动DrawerLayout 实现左右滑动。

更多项目在《IT蓝豹》学android特效
项目大体实现:

package easy.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 easy.R;
import easy.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 easy.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 easy.R;
import easy.fragment.discover.fm.CoverFragment;
import easy.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;
    }
}

文章来源《IT蓝豹》android特效


发表评论
切换编辑模式