android圆形背景
❶ 在android中怎样让按钮漂浮在图片上
android悬浮按钮(Floating action button)的两种实现方法
最近android中有很多新的设计规范被引入,最流行的莫过于被称作Promoted Actions的设计了,Promoted Actions是指一种操作按钮,它不是放在actionbar中,而是直接在可见的UI布局中(当然这里的UI指的是setContentView所管辖的范围)。因此它更容易在代码中被获取到(试想如果你要在actionbar中获取一个菜单按钮是不是很难?),Promoted Actions往往主要用于一个界面的主要操作,比如在email的邮件列表界面,promoted action可以用于接受一个新邮件。promoted action在外观上其实就是一个悬浮按钮,更常见的是漂浮在界面上的圆形按钮,一般我直接将promoted action称作悬浮按钮,英文名称Float Action Button简称(FAB,不是FBI哈)。
floatactionbutton是android l中的产物,但是我们也可以在更早的版本中实现。假设我这里有一个列表界面,我想使用floatactionbutton代表添加新元素的功能,界面如下:
要实现floatactionbutton可以有多种方法,一种只适合android L,另外一种适合任意版本。
用ImageButton实现
这种方式其实是在ImageButton的属性中使用了android L才有的一些特性:
<ImageButton
android:layout_width="56dp"
android:layout_height="56dp"
android:src="@drawable/plus"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
android:tint="@android:color/white"
android:id="@+id/fab"
android:elevation="1dp"
android:background="@drawable/ripple"
android:stateListAnimator="@anim/fab_anim"
/>
仔细一点,你会发现我们将这个ImageButton放到了布局的右下角,为了实现floatactionbutton应该具备的效果,需要考虑以下几个方面:
·Background
·Shadow
·Animation
背景上我们使用ripple drawable来增强吸引力。注意上面的xml代码中我们将background设置成了@drawable/ripple,ripple drawable的定义如下:
<ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?android:colorControlHighlight">
<item>
<shape android:shape="oval">
<solid android:color="?android:colorAccent" />
</shape>
</item>
</ripple>
既然是悬浮按钮,那就需要强调维度上面的感觉,当按钮被按下的时候,按钮的阴影需要扩大,并且这个过程是渐变的,我们使用属性动画去改变translatioz。
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_enabled="true"
android:state_pressed="true">
<objectAnimator
android:ration="@android:integer/config_shortAnimTime"
android:propertyName="translationZ"
android:valueFrom="@dimen/start_z"
android:valueTo="@dimen/end_z"
android:valueType="floatType" />
</item>
<item>
<objectAnimator
android:ration="@android:integer/config_shortAnimTime"
android:propertyName="translationZ"
android:valueFrom="@dimen/end_z"
android:valueTo="@dimen/start_z"
android:valueType="floatType" />
</item>
</selector>
使用自定义控件的方式实现悬浮按钮
这种方式不依赖于android L,而是码代码。
首先定义一个这样的类:
public class CustomFAB extends ImageButton {
...
}
然后是读取一些自定义的属性(假设你了解styleable的用法)
private void init(AttributeSet attrSet) {
Resources.Theme theme = ctx.getTheme();
TypedArray arr = theme.obtainStyledAttributes(attrSet, R.styleable.FAB, 0, 0);
try {
setBgColor(arr.getColor(R.styleable.FAB_bg_color, Color.BLUE));
setBgColorPressed(arr.getColor(R.styleable.FAB_bg_color_pressed, Color.GRAY));
StateListDrawable sld = new StateListDrawable();
sld.addState(new int[] {android.R.attr.state_pressed}, createButton(bgColorPressed));
sld.addState(new int[] {}, createButton(bgColor));
setBackground(sld);
}
catch(Throwable t) {}
finally {
arr.recycle();
}
}
在xml中我们需要加入如下代码,一般是在attr.xml文件中。
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="FAB">
<!-- Background color -->
<attr name="bg_color" format="color|reference"/>
<attr name="bg_color_pressed" format="color|reference"/>
</declare-styleable>
</resources>
使用StateListDrawable来实现不同状态下的背景
private Drawable createButton(int color) {
OvalShape oShape = new OvalShape();
ShapeDrawable sd = new ShapeDrawable(oShape);
setWillNotDraw(false);
sd.getPaint().setColor(color);
OvalShape oShape1 = new OvalShape();
ShapeDrawable sd1 = new ShapeDrawable(oShape);
sd1.setShaderFactory(new ShapeDrawable.ShaderFactory() {
@Override
public Shader resize(int width, int height) {
LinearGradient lg = new LinearGradient(0,0,0, height,
new int[] {
Color.WHITE,
Color.GRAY,
Color.DKGRAY,
Color.BLACK
}, null, Shader.TileMode.REPEAT);
return lg;
}
});
LayerDrawable ld = new LayerDrawable(new Drawable[] { sd1, sd });
ld.setLayerInset(0, 5, 5, 0, 0);
ld.setLayerInset(1, 0, 0, 5, 5);
return ld;
}
最后将控件放xml中:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:custom="http://schemas.android.com/apk/res/com.survivingwithandroid.fab"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MyActivity">
...
<com.survivingwithandroid.fab.CustomFAB
android:layout_width="56dp"
android:layout_height="56dp"
android:src="@android:drawable/ic_input_add"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="16dp"
android:layout_marginBottom="16dp"
custom:bg_color="@color/light_blue"
android:tint="@android:color/white"
/>
</RelativeLayout>
❷ android progressbar的白色背景怎么去掉
下面这个图片是progressbar的各种样式,不知道能不能满足您的要求,例子来自于android学习手册,360手机助手中可以下载,里面有108个android例子,点击源码可以看源码,点击文档可以看文档。
1、说明
在某些操作的进度中的可视指示器,为用户呈现操作的进度,还它有一个次要的进度条,用来显示中间进度,如在流媒体播放的缓冲区的进度。一个进度条也可不确定其进度。在不确定模式下,进度条显示循环动画。这种模式常用于应用程序使用任务的长度是未知的。
2、XML重要属性
android:progressBarStyle:默认进度条样式
android:progressBarStyleHorizontal:水平样式
3 重要方法
getMax():返回这个进度条的范围的上限
getProgress():返回进度
getSecondaryProgress():返回次要进度
incrementProgressBy(int diff):指定增加的进度
isIndeterminate():指示进度条是否在不确定模式下
setIndeterminate(boolean indeterminate):设置不确定模式下
setVisibility(int v):设置该进度条是否可视
4 重要事件
onSizeChanged(int w, int h, int oldw, int oldh):当进度值改变时引发此事件
5进度条的样式
Widget.ProgressBar.Horizontal长形进度
Androidxml 布局:
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="@android:style/Widget.ProgressBar.Horizontal "
/>
源码:
private ProgressBar mProgress;
private int mProgressStatus=0;
private Handler mHandler=newHandler();
@Override
protected void onCreate(BundlesavedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mProgress=(ProgressBar)findViewById(R.id.progress_bar);
new Thread(new Runnable(){
@Override
public void run(){
while(mProgressStatus<100){
mProgressStatus=doWork();
mHandler.post(new Runnable(){
@Override
public void run(){
mProgress.setProgress(mProgressStatus);
}
});
}
}
}).start();
}
效果图:
带第二进度的进度条
xml配置如下:
<ProgressBar
android:id="@+id/progress_bar_with_second"
style="@android:style/Widget.ProgressBar.Horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:progress="40"
android:secondaryProgress="70"
android:paddingTop="20dp"
android:paddingBottom="20dp"/>
这里我们设置了初始的进度为40,android:progress的值在mini和max之间即mini<=progressvalue<=max
设置了第二进度条的进度值为70,该值也在mini和max之间。
效果如下:
不确定模式进度条
xml配置文件:
<ProgressBar
android:id="@+id/progress_bar_indeterminate"
style="@android:style/Widget.ProgressBar.Horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:indeterminate="true"
android:indeterminateBehavior="cycle"
android:paddingBottom="20dp"
android:paddingTop="20dp"
android:progress="40" />
这里通过android:indeterminate="true"设置了当前为无模式进度条
效果如图:
普通圆形进度:Widget.ProgressBar.Inverse
<ProgressBar
android:id="@+id/progress_bar1"
style="@android:style/Widget.ProgressBar.Inverse"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:progress="50"
android:background="#ff00ff"
android:paddingTop="4dp" />
通过android:backgroup设置了背景色
❸ android 怎么把button变成圆形
使用shape,请看下面截图,例子来自于android学习手册,360手机助手中下载,里面有108个例子、源码还有文档。
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:Android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<!-- 填充的颜色 -->
<solid android:color="#FFFFFF"/>
<!-- 设置按钮的四个角为弧形 -->
<!-- android:radius 弧形的半径 -->
<corners android:radius="360dip"/>
<!-- padding: Button 里面的文字与Button边界的间隔 -->
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp"
/>
</shape>
-----Main layout文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/soft_info"
/>
<!—直接设置背景 -->
<Button
android:id="@+id/roundBtn1"
android:background="@drawable/btn_oval"
android:layout_width="50dip"
android:layout_height="50dip"
/>
<!— 调用shape自定义xml文件 -->
<Button
android:id="@+id/roundBtn"
android:text="椭圆按钮"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/main_menu_btnshape"
/>
</LinearLayout>
----acitivity文件
public class MyLifeActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}
❹ android中怎么绘制这种圆形布局
圆形是个背景,可以通过xml定义背景图片
在res/drawable/下添加背景xml,test.xml代码如下
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item >
<shape android:shape="oval">
<padding android:top="2dp" android:right="2dp" android:bottom="2dp" android:left="2dp" />
<solid android:color="#00a0eb"/>
</shape>
</item>
<item >
<shape android:shape="oval">
<solid android:color="#ffffffff"/>
</shape>
</item>
</layer-list>
然后在layout下添加布局文件
代码如下
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="indi.zcm.dropdown.MainActivity" >
<RelativeLayout
android:layout_width="100dp"
android:layout_height="100dp"
android:background="@drawable/test">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="27dp"
android:text="购买人数" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="45dp"
android:textSize="26sp"
android:text="32514" />
</RelativeLayout>
</RelativeLayout>
这个应该就是你要的效果
❺ android圆形灰色图片做按钮背景,圆形背景上需要叠加一张图片和文字,文字要在图片的下方,怎么实现
用android:drawableTop设置图片就好了。
❻ android 开发 imgview 怎么弄成圆形
imageview的属性中可以加入background来定义它的背景,将背景定义成一个圆形的drawable就可以了。
另一种办法,也可以自己定义一个view来显示圆形的图片,你可以参考http://blog.csdn.net/alan_biao/article/details/17379925来进行设计。