您的位置:首页 > 移动开发 > IOS开发

自定义仿IOS底部弹出Dialog

2016-12-30 18:01 1986 查看
//1.先看一张效果图



//主界面就是一个button,点击弹出dialog

2.1 我们先看看dialog的布局代码如下:

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:layout_marginBottomPercent="5%"
android:background="@android:color/transparent"
android:orientation="vertical">

<TextView
android:id="@+id/tv_male"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="@drawable/bg_male"
android:gravity="center"
android:text="男"
android:textColor="@color/statebar"
android:textSize="22sp" />

<TextView
android:layout_width="match_parent"
android:layout_height="1px"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="@color/clickno" />

<TextView
android:id="@+id/tv_female"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="@drawable/bg_female"
android:gravity="center"
android:text="女"
android:textColor="@color/statebar"
android:textSize="22sp" />

<TextView
android:id="@+id/tv_cancel"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="16dp"
android:background="@drawable/bg_cancel"
android:gravity="center"
android:text="取消"
android:textColor="@color/statebar"
android:textSize="22sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.percent.PercentRelativeLayout>


//布局代码没什么好说的,再看看自定义dialog的代码如下:

public class IosChoosDialog extends Dialog implements View.OnClickListener {

private DisplayMetrics displayMetrics;
private View view;

public IosChoosDialog(Context context) {
super(context,R.style.testDialog);

mContext = context;
displayMetrics = context.getResources().getDisplayMetrics();
}

private Context mContext;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//设置view 弹出的平移动画,从底部-100% 平移到自身位置
TranslateAnimation animation = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF,
0f, Animation.RELATIVE_TO_SELF, 1f, Animation.RELATIVE_TO_SELF, 0);
animation.setInterpolator(new DecelerateInterpolator());
animation.setDuration(350);
animation.setStartOffset(150);

//把view冲气冲进来
view = View.inflate(mContext, R.layout.layout_second_dialog, null);
view.setAnimation(animation);//设置动画

TextView tvMale = (TextView) view.findViewById(R.id.tv_male);
TextView tvFemale = (TextView) view.findViewById(R.id.tv_female);
TextView tvCancel = (TextView) view.findViewById(R.id.tv_cancel);
tvMale.setOnClickListener(this);
tvFemale.setOnClickListener(this);
tvCancel.setOnClickListener(this);

}

@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.tv_male:
if (onResultChangeListener != null) {
onResultChangeListener.resultChanged("男");
}
break;
case R.id.tv_female:
if (onResultChangeListener != null) {
onResultChangeListener.resultChanged("女");
}
break;
case R.id.tv_cancel://取消
default:
break;
}
dismiss();
}

private OnResultChangeListener onResultChangeListener;

//对外的接口回调
public interface OnResultChangeListener {
void resultChanged(String result);
}

public void setOnResultChangeListener(OnResultChangeListener onResultChangeListener) {
this.onResultChangeListener = onResultChangeListener;
}

@Override
public void show() {
super.show();
//设置dialog的宽高是全屏,注意:一定要放在show的后面,否则不是全屏显示
WindowManager.LayoutParams params = getWindow().getAttributes();
params.width = displayMetrics.widthPixels;
params.height =ViewGroup.LayoutParams.MATCH_PARENT ;
params.gravity = Gravity.BOTTOM;
getWindow().setAttributes(params);
getWindow().setContentView(view);
}

}


//2.2上面要注意的两点:

第一:全屏显示的设置,一定要在show的后面;

第二:就是dialog的style,(style决定了dialog的显示)

//2.3 来看看style 的代码如下:

<style name="testDialog" parent="@android:style/Theme.Translucent">
<item name="android:windowFrame">@null</item>
<item name="android:windowNoTitle">true</item>//无标题
<item name="android:windowBackground">@drawable/bg_dialog</item>//背景
<item name="android:windowIsFloating">true</item>//悬浮
<item name="android:windowContentOverlay">@null</item>
<item name="android:backgroundDimEnabled">false</item>
</style>


//2.4 mainactivity的代码如下:

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
public void showIosDialog(View view){
IosChoosDialog dialog=new IosChoosDialog(this);
dialog.setOnResultChangeListener(new IosChoosDialog.OnResultChangeListener(){
@Override
public void resultChanged(String result) {
//返回的性别
Toast.makeText(MainActivity.this,result,Toast.LENGTH_SHORT);
}
});
dialog.show();
}
}


总结:dialog自定义其实就是布局充气到界面上,但是一定要注意主题的设置。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  android dialog仿ios