Design各控件的搭配使用4

gundumw100

浏览: 5818439 次
性别:
来自: 上海

最近访客更多访客>>

李大喵和李小喵

hjg8858

henseycai

beishen

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

Material Design

android

在上一个版本基础上添加两个Activity： EffectsActivity&TabLayoutActivity

EffectsActivity测试了一种效果；

TabLayoutActivity中使用的控件：
android.support.design.widget.TabLayout
android.support.v4.widget.NestedScrollView
android.support.design.widget.TextInputLayout

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.content.Context;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.Button;
import android.widget.LinearLayout;

public class EffectsActivity extends AppCompatActivity implements View.OnClickListener{

	private Context context;
	
	private LinearLayout main_view;
	private LinearLayout pop_view;
	private int main_view_height;
	private int pop_view_height;
	private Button btn_show;
	private Button btn_hide;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_test);
		context=this;
		main_view = (LinearLayout)findViewById(R.id.main_view);
		pop_view = (LinearLayout)findViewById(R.id.pop_view);
		btn_show = (Button)findViewById(R.id.btn_show);
		btn_hide = (Button)findViewById(R.id.btn_hide);
		btn_show.setOnClickListener(this);
		btn_hide.setOnClickListener(this);
		main_view.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
	            @Override
	            public void onGlobalLayout() {
	            	main_view_height = main_view.getHeight();
	            	main_view.getViewTreeObserver().removeGlobalOnLayoutListener(this);
	            }
		});
		pop_view.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
	            @Override
	            public void onGlobalLayout() {
	            	pop_view_height = pop_view.getHeight();
	            	pop_view.getViewTreeObserver().removeGlobalOnLayoutListener(this);
	            }
		});	
		
	}
	
	@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
		switch (v.getId()) {
		case R.id.btn_show:
			show();
			break;
		case R.id.btn_hide:
			hide();
			break;

		default:
			break;
		}
	}	
	
	private void show(){
        ObjectAnimator fViewScaleXAnim=ObjectAnimator.ofFloat(main_view,"scaleX",1.0f,0.8f);
        fViewScaleXAnim.setDuration(350);
        ObjectAnimator fViewScaleYAnim=ObjectAnimator.ofFloat(main_view,"scaleY",1.0f,0.8f);
        fViewScaleYAnim.setDuration(350);
        ObjectAnimator fViewAlphaAnim=ObjectAnimator.ofFloat(main_view,"alpha",1.0f,0.5f);
        fViewAlphaAnim.setDuration(350);
        ObjectAnimator fViewRotationXAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 0f, 10f);
        fViewRotationXAnim.setDuration(200);
        ObjectAnimator fViewResumeAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 10f, 0f);
        fViewResumeAnim.setDuration(150);
        fViewResumeAnim.setStartDelay(200);
        ObjectAnimator fViewTransYAnim=ObjectAnimator.ofFloat(main_view,"translationY",0,-0.1f* main_view_height);
        fViewTransYAnim.setDuration(350);
        ObjectAnimator sViewTransYAnim=ObjectAnimator.ofFloat(pop_view,"translationY",pop_view_height,0);
        sViewTransYAnim.setDuration(350);
        sViewTransYAnim.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationStart(Animator animation) {
                super.onAnimationStart(animation);
                pop_view.setVisibility(View.VISIBLE);
                btn_show.setEnabled(!pop_view.isShown());
            }
            
        });
        AnimatorSet showAnim=new AnimatorSet();
        showAnim.playTogether(fViewScaleXAnim,fViewRotationXAnim,fViewResumeAnim,fViewTransYAnim,fViewAlphaAnim,fViewScaleYAnim,sViewTransYAnim);
        showAnim.start();
    }	
	 
	private void hide(){
        ObjectAnimator fViewScaleXAnim=ObjectAnimator.ofFloat(main_view,"scaleX",0.8f,1.0f);
        fViewScaleXAnim.setDuration(350);
        ObjectAnimator fViewScaleYAnim=ObjectAnimator.ofFloat(main_view,"scaleY",0.8f,1.0f);
        fViewScaleYAnim.setDuration(350);
        ObjectAnimator fViewAlphaAnim=ObjectAnimator.ofFloat(main_view,"alpha",0.5f,1.0f);
        fViewAlphaAnim.setDuration(350);
        ObjectAnimator fViewRotationXAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 0f, 10f);
        fViewRotationXAnim.setDuration(200);
        ObjectAnimator fViewResumeAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 10f, 0f);
        fViewResumeAnim.setDuration(150);
        fViewResumeAnim.setStartDelay(200);
        ObjectAnimator fViewTransYAnim=ObjectAnimator.ofFloat(main_view,"translationY",-0.1f* main_view_height,0);
        fViewTransYAnim.setDuration(350);
        ObjectAnimator sViewTransYAnim=ObjectAnimator.ofFloat(pop_view,"translationY",0,pop_view_height);
        sViewTransYAnim.setDuration(350);
        sViewTransYAnim.addListener(new AnimatorListenerAdapter() {  
            @Override  
            public void onAnimationEnd(Animator animation) {  
            	 super.onAnimationEnd(animation);
            	 pop_view.setVisibility(View.INVISIBLE);
            	 btn_show.setEnabled(!pop_view.isShown());
            }
            
        });
        AnimatorSet showAnim=new AnimatorSet();
        showAnim.playTogether(fViewScaleXAnim,fViewRotationXAnim,fViewResumeAnim,fViewTransYAnim,fViewAlphaAnim,fViewScaleYAnim,sViewTransYAnim);
        showAnim.start();
    }

	public boolean isShown(){
		return pop_view.isShown();
	}
	
	@Override
	public void onBackPressed() {
		// TODO Auto-generated method stub
		if(isShown()){
			hide();
		}else{
			super.onBackPressed();
		}
	}
	
	
}

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.content.Context;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.Button;
import android.widget.LinearLayout;

public class EffectsActivity extends AppCompatActivity implements View.OnClickListener{

	private Context context;
	
	private LinearLayout main_view;
	private LinearLayout pop_view;
	private int main_view_height;
	private int pop_view_height;
	private Button btn_show;
	private Button btn_hide;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_effects);
		context=this;
		main_view = (LinearLayout)findViewById(R.id.main_view);
		pop_view = (LinearLayout)findViewById(R.id.pop_view);
		btn_show = (Button)findViewById(R.id.btn_show);
		btn_hide = (Button)findViewById(R.id.btn_hide);
		btn_show.setOnClickListener(this);
		btn_hide.setOnClickListener(this);
		main_view.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
	            @Override
	            public void onGlobalLayout() {
	            	main_view_height = main_view.getHeight();
	            	main_view.getViewTreeObserver().removeGlobalOnLayoutListener(this);
	            }
		});
		pop_view.getViewTreeObserver().addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
	            @Override
	            public void onGlobalLayout() {
	            	pop_view_height = pop_view.getHeight();
	            	pop_view.getViewTreeObserver().removeGlobalOnLayoutListener(this);
	            }
		});	
		
	}
	
	@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
		switch (v.getId()) {
		case R.id.btn_show:
			show();
			break;
		case R.id.btn_hide:
			hide();
			break;

		default:
			break;
		}
	}	
	
	private void show(){
        ObjectAnimator fViewScaleXAnim=ObjectAnimator.ofFloat(main_view,"scaleX",1.0f,0.8f);
        fViewScaleXAnim.setDuration(350);
        ObjectAnimator fViewScaleYAnim=ObjectAnimator.ofFloat(main_view,"scaleY",1.0f,0.8f);
        fViewScaleYAnim.setDuration(350);
        ObjectAnimator fViewAlphaAnim=ObjectAnimator.ofFloat(main_view,"alpha",1.0f,0.5f);
        fViewAlphaAnim.setDuration(350);
        ObjectAnimator fViewRotationXAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 0f, 10f);
        fViewRotationXAnim.setDuration(200);
        ObjectAnimator fViewResumeAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 10f, 0f);
        fViewResumeAnim.setDuration(150);
        fViewResumeAnim.setStartDelay(200);
        ObjectAnimator fViewTransYAnim=ObjectAnimator.ofFloat(main_view,"translationY",0,-0.1f* main_view_height);
        fViewTransYAnim.setDuration(350);
        ObjectAnimator sViewTransYAnim=ObjectAnimator.ofFloat(pop_view,"translationY",pop_view_height,0);
        sViewTransYAnim.setDuration(350);
        sViewTransYAnim.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationStart(Animator animation) {
                super.onAnimationStart(animation);
                pop_view.setVisibility(View.VISIBLE);
                btn_show.setEnabled(!pop_view.isShown());
            }
            
        });
        AnimatorSet showAnim=new AnimatorSet();
        showAnim.playTogether(fViewScaleXAnim,fViewRotationXAnim,fViewResumeAnim,fViewTransYAnim,fViewAlphaAnim,fViewScaleYAnim,sViewTransYAnim);
        showAnim.start();
    }	
	 
	private void hide(){
        ObjectAnimator fViewScaleXAnim=ObjectAnimator.ofFloat(main_view,"scaleX",0.8f,1.0f);
        fViewScaleXAnim.setDuration(350);
        ObjectAnimator fViewScaleYAnim=ObjectAnimator.ofFloat(main_view,"scaleY",0.8f,1.0f);
        fViewScaleYAnim.setDuration(350);
        ObjectAnimator fViewAlphaAnim=ObjectAnimator.ofFloat(main_view,"alpha",0.5f,1.0f);
        fViewAlphaAnim.setDuration(350);
        ObjectAnimator fViewRotationXAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 0f, 10f);
        fViewRotationXAnim.setDuration(200);
        ObjectAnimator fViewResumeAnim = ObjectAnimator.ofFloat(main_view, "rotationX", 10f, 0f);
        fViewResumeAnim.setDuration(150);
        fViewResumeAnim.setStartDelay(200);
        ObjectAnimator fViewTransYAnim=ObjectAnimator.ofFloat(main_view,"translationY",-0.1f* main_view_height,0);
        fViewTransYAnim.setDuration(350);
        ObjectAnimator sViewTransYAnim=ObjectAnimator.ofFloat(pop_view,"translationY",0,pop_view_height);
        sViewTransYAnim.setDuration(350);
        sViewTransYAnim.addListener(new AnimatorListenerAdapter() {  
            @Override  
            public void onAnimationEnd(Animator animation) {  
            	 super.onAnimationEnd(animation);
            	 pop_view.setVisibility(View.INVISIBLE);
            	 btn_show.setEnabled(!pop_view.isShown());
            }
            
        });
        AnimatorSet showAnim=new AnimatorSet();
        showAnim.playTogether(fViewScaleXAnim,fViewRotationXAnim,fViewResumeAnim,fViewTransYAnim,fViewAlphaAnim,fViewScaleYAnim,sViewTransYAnim);
        showAnim.start();
    }

	public boolean isShown(){
		return pop_view.isShown();
	}
	
	@Override
	public void onBackPressed() {
		// TODO Auto-generated method stub
		if(isShown()){
			hide();
		}else{
			super.onBackPressed();
		}
	}
	
	
}

import android.content.Context;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.View;

public class TabLayoutActivity extends AppCompatActivity implements View.OnClickListener {

	private Context context;

	private TabLayout tabLayout;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_tablayout);
		context = this;
		
		Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
		//使用了ActionBarDrawerToggle之后，下面的设置可以不用
		// App Logo
//        toolbar.setLogo(R.drawable.ic_launcher);
        // Title
        toolbar.setTitle("TabLayout");
        // Sub Title
        toolbar.setSubtitle("only a test");
        //Navigation Icon
//        toolbar.setNavigationIcon(R.drawable.ic_launcher);//不设置，默认是返回箭头
        setSupportActionBar(toolbar);
        
        //需要将setSupportActionBar(toolbar)放在setNavigationOnClickListener()之前设置才会响应click event
        toolbar.setNavigationOnClickListener(new View.OnClickListener() {
			
			@Override
			public void onClick(View v) {
				// TODO Auto-generated method stub
				finish();
			}
		});
        
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        
		tabLayout = (TabLayout) findViewById(R.id.tabLayout);
		tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
		tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
		tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));
		tabLayout.addTab(tabLayout.newTab().setText("Tab 4"));
	}

	@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
	}

}

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/coordinatorLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity" >

    <!-- AppBarLayout目前必须是第一个嵌套在CoordinatorLayout里面的子view -->
    <!-- AppBarLayout里面定义的view只要设置了app:layout_scrollFlags属性，就可以在RecyclerView滚动事件发生的时候被触发： -->
    <!-- app:layout_scrollFlags属性里面必须至少启用scroll这个flag，这样这个view才会滚动出屏幕，否则它将一直固定在顶部。 -->
    <!--
	可以使用的其他flag有：
		enterAlways: 一旦向上滚动这个view就可见。
		enterAlwaysCollapsed: 顾名思义，这个flag定义的是何时进入（已经消失之后何时再次显示）。假设你定义了一个最小高度（minHeight）同时enterAlways也定义了，那么view将在到达这个最小高度的时候开始显示，并且从这个时候开始慢慢展开，当滚动到顶部的时候展开完。
		exitUntilCollapsed: 同样顾名思义，这个flag时定义何时退出，当你定义了一个minHeight，这个view将在滚动到达这个最小高度的时候消失。
    -->
    <!-- 记住，要把带有scroll flag的view放在前面，这样收回的view才能让正常退出，而固定的view继续留在顶部。 -->

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" >

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
            app:titleTextAppearance="@style/TextAppearance.AppCompat.Headline" />

        <!-- 如果想要 TabLayout从屏幕上消失，只需要给 TabLayout属性app:layout_scrollFlags="scroll|enterAlways" -->
        <!-- 如果你屏幕上显示只有少数 tab 的时候，可以设置tabMode="fixed",若很多需要拖动，则设置tabMode="scroll" -->
        <!-- 如果 tabMode 设置成 scrollable 的，则tabGravity属性将会被忽略 -->

        <android.support.design.widget.TabLayout
            android:id="@+id/tabLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabGravity="fill"
            app:tabMode="fixed"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <android.support.design.widget.TextInputLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="16dp" >

                <EditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="Username" />
            </android.support.design.widget.TextInputLayout>

            <android.support.design.widget.TextInputLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="16dp" >

                <EditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="Password" />
            </android.support.design.widget.TextInputLayout>

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="test" />
        </LinearLayout>
    </android.support.v4.widget.NestedScrollView>

</android.support.design.widget.CoordinatorLayout>

Test.rar (4.4 MB)
描述: android5.1.1编译，需要v7-appcompat,design等扩展包
下载次数: 0

分享到：

iconify使用文本替换icon测试 | Design各控件的搭配使用3

2015-08-28 17:01
浏览 1475
评论(0)
分类:移动开发
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Design各控件的搭配使用4

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Design各控件的搭配使用4

评论

发表评论

相关推荐

TabLayout和ViewPager结合使用

AppBarLayout.OnOffsetChangedListener的使用

Design各控件的搭配使用3

Design各控件的搭配使用2

Design各控件的搭配使用

ItemTouchHelper之SwipeDismiss

CoordinatorLayout之Behavior使用

support.v4之SlidingPaneLayout简单使用

android5.0之CardView

ToolBar&DrawerLayout基本结构

android5.0之RecyclerView

RecylerView相关文章

最近访客更多访客>>