Toolbar + CardView

一、Toolbar 标题栏

它的出现规范并拓展了APP标题栏的设计风格,极大地提高了开发效率,而且Material Design设计规范也越来越多出现在我们常用的APP中,因此有必要了解。
下面是一个较简单的示例,
(1)界面布局XML


(2)MainActivity.java

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()){
        case  android.R.id.home:
            finish();
            break;
        case R.id.tab_add:
            Toast.makeText(MainActivity.this," tab add",Toast.LENGTH_SHORT)
                    .show();
            break;

        case R.id.tab_about:
            Toast.makeText(MainActivity.this," tab about",Toast.LENGTH_SHORT)
                    .show();
            break;

        case R.id.tab_before:
            Toast.makeText(MainActivity.this," tab before",Toast.LENGTH_SHORT)
                    .show();
            break;
    }
    return super.onOptionsItemSelected(item);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu,menu);   //加载menu
    return super.onCreateOptionsMenu(menu);
}

Toolbar中包含NavigationIcon、logo、正副标题、菜单选项、自定义view等,详细见这位大神的小结。
Toolbar的正确使用姿势
Toolbar + CardView_第1张图片

二、CardView

酷炫的卡片布局,可以满足跟多人的酷炫风。下面是简单的示例
(1)布局XML




    

    

        

            

            
        

    

(2)MainActivity.java

public class MainActivity extends AppCompatActivity {
    private Toolbar myToolbar;
    private CardView cardView;
    private int count = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        myToolbar = findViewById(R.id.my_tb);
        cardView = findViewById(R.id.cardView);
        setSupportActionBar(myToolbar);   //让Toolbar代替Actionbar

        cardView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                setAnim();
            }
        });
    }

    private void setAnim() {     //点击卡片产生平移效果
        cardView.animate().translationX(100 + count).setDuration(1000).start();
        count += 100;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {     //button点击事件
        switch (item.getItemId()){
            case  android.R.id.home:
                finish();
                break;
            case R.id.tab_add:
                Toast.makeText(MainActivity.this," tab add",Toast.LENGTH_SHORT)
                        .show();
                break;

            case R.id.tab_about:
                Toast.makeText(MainActivity.this," tab about",Toast.LENGTH_SHORT)
                        .show();
                break;

            case R.id.tab_before:
                Toast.makeText(MainActivity.this," tab before",Toast.LENGTH_SHORT)
                        .show();
                break;
        }
        return super.onOptionsItemSelected(item);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {     //重写此方法后,action menu就会显示
        getMenuInflater().inflate(R.menu.menu,menu);   //加载menu
        return super.onCreateOptionsMenu(menu);
    }
}

Toolbar + CardView_第2张图片

三、沉侵式状态栏

将需要此形式的 activity 的 theme 设置成如下style即可。




 

Toolbar + CardView_第3张图片

你可能感兴趣的:(Android,Toolbar,CardView)