下面,下来看一个Demo的效果,代码如下:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/root_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="10dp"
android:src="@drawable/ic_launcher"
app:fabSize="normal"/>
</FrameLayout>
 import android.os.Bundle;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.FrameLayout; public class MainActivity2 extends AppCompatActivity {
private FloatingActionButton fab_btn = null;
private FrameLayout root_layout = null;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2); root_layout = (FrameLayout) this.findViewById(R.id.root_layout);
fab_btn = (FloatingActionButton) this.findViewById(R.id.fab_btn);
fab_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Snackbar.make(root_layout, "我出来了", Snackbar.LENGTH_LONG)
.setAction("知道了", new View.OnClickListener() {
@Override
public void onClick(View v) { }
}).show();
}
});

}
}

如上图所示,问题出来了,底部弹出来的把浮动的小圆给挡住了。这样到然是有问题的。所以需要再次进行修改。

修改代码如下:

 <android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/root_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|right"
android:layout_margin="10dp"
android:src="@drawable/ic_launcher"
app:fabSize="normal"/>
</android.support.design.widget.CoordinatorLayout>
 package com.example.com.designdemo;

 import android.os.Bundle;
import android.support.design.widget.CoordinatorLayout;
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.view.View; public class MainActivity2 extends AppCompatActivity {
private FloatingActionButton fab_btn = null;
private CoordinatorLayout root_layout = null;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main2); root_layout = (CoordinatorLayout) this.findViewById(R.id.root_layout);
fab_btn = (FloatingActionButton) this.findViewById(R.id.fab_btn);
fab_btn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Snackbar.make(root_layout, "我出来了", Snackbar.LENGTH_LONG)
.setAction("知道了", new View.OnClickListener() {
@Override
public void onClick(View v) {
}
}).show();
}
});
}
}

现在的效果就不会被挡住了,只需要把最外层的 FrameLayout修改成CoordinatorLayout 即可,非常方便。

63、具有过渡动画效果的布局Layout的更多相关文章

  1. 64、具有过渡动画效果的布局Layout( 2 )

    [ CoordinatorLayout-与手势完美结合的滑动视图 ] [ AppBarLayout-可以随手势滑动的AppBar ] <android.support.design.widget ...

  2. 067——VUE中vue-router之使用transition设置酷炫的路由组件过渡动画效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. react过渡动画效果的实现,react-transition-group

    本文介绍react相关的过渡动画效果的实现 有点类似vue的transition组件,主要用于组件mount和unmount之前切换时应用动画效果 安装 cnpm install react-tran ...

  4. vue过渡动画效果

    1 过渡基础 1.1 过渡的方式 Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果. 包括以下工具: 在 CSS 过渡和动画中自动应用 class 可以配合使用第三方 CSS ...

  5. CSS中的变形、过渡、动画效果

    一.变形 .过渡效果 1:元素平移 x方向 y方向 transform:translate(100px 100px); 2:过渡动画效果 a:什么属性参与过渡效果 b:过渡时间 c:过渡的效果 值包含 ...

  6. 【Android UI设计与开发】第03期:引导界面(三)仿微信引导界面以及动画效果

    基于前两篇比较简单的实例做铺垫之后,这一篇我们来实现一个稍微复杂一点的引导界面的效果,当然也只是稍微复杂了一点,对于会的人来说当然还是so easy!正所谓会者不难,难者不会,大概说的就是这个意思了吧 ...

  7. app引导页(背景图片切换加各个页面动画效果)

    前言:不知不觉中又加班到了10点半,整个启动页面做了一天多的时间,一共有三个页面,每个页面都有动画效果,动画效果调试起来麻烦,既要跟ios统一,又要匹配各种不同的手机,然后产品经理还有可能在中途改需求 ...

  8. Windows Store App 过渡动画

    Windows Store App 过渡动画     在开发Windows应用商店应用程序时,如果希望界面元素进入或者离开屏幕时显得自然和流畅,可以为其添加过渡动画.过渡动画能够及时地提示用户屏幕所发 ...

  9. Swift - 动画效果的实现方法总结(附样例)

    在iOS中,实现动画有两种方法.一个是统一的animateWithDuration,另一个是组合出现的beginAnimations和commitAnimations.这三个方法都是类方法. 一,使用 ...

随机推荐

  1. 【DB2】NVL2函数

    语法: NVL2(表达式1,表达式2,表达式3) 如果表达式1为空,返回值为表达式3的值.如果表达式1不为空,返回值为表达式2的值. 例子: SELECT ID, NVL2(SEX,'非空','空值' ...

  2. 解决chrome和firefox flash不透明的方法

    透明flash在IE内核的浏览器下正常.在chrome和火狐下不透明了. 解决方法: <object height="377" width="712" c ...

  3. 3.3v转5v开关电源芯片LM2731

    方案一 输入3.3(可为2.7~14v):输出5v,700ma.已经过实际验证. 其中:C1,C2为贴片陶瓷电容,Cf也为贴片陶瓷电容,L1为6.8uH 电感 输出值只和R1,R2的值有关,但手册中又 ...

  4. OPC UA的监控项、订阅、和通知

    MonitoredItem 每个监控项均指明了要监控的项目(item)和用来发送通知的订阅. item可以是一个节点的属性(node attribute). MonitorItem可以监控一个属性,一 ...

  5. Jumpserver web界面跳板机

    Jumpserver.org 普通用户 仪表盘 查看主机 上传下载 访问官网 欢迎使用Jumpserver开源跳板机系统 帮助 Log out 查看资产 仪表盘 资产管理 查看资产 主机详细信息列表 ...

  6. scrapy抓取的中文结果乱码解决办法

    使用scrapy抓取的结果,中文默认是Unicode,无法显示中文. 中文默认是Unicode,如: \u5317\u4eac\u5927\u5b66 在setting文件中设置: FEED_EXPO ...

  7. import { Subject } from 'rxjs/Subject';

    shared-service.ts import { Observable } from 'rxjs/Observable'; import { Injectable } from '@angular ...

  8. vivado sdk生成elf文件出错:make: Interrupt/Exception caught (code = 0xc00000fd, addr = 0x4227d3)

    vivado sdk生成elf文件出错:make: Interrupt/Exception caught (code = 0xc00000fd, addr = 0x4227d3) Might be a ...

  9. [k8s]监控

    监控架构 参考 https://github.com/DataDog/the-monitor/blob/master/kubernetes/how-to-collect-and-graph-kuber ...

  10. POSTGRESQL 9.1 FATAL: password authentication failed for user "postgres"

    1.配置postgreql 可以远程访问: sudo vim /etc/postgresql/9.1/main/postgresql.conf root@ubuntuserver:~# sudo vi ...