ActionSheetForAndroid安卓版本的ActionSheet

泡在网上的日子 发表于 2014-09-05 15:57 第 3986 次阅读 ActionSheet,开源

0

编辑推荐：稀土掘金，这是一个针对技术开发者的一个应用，你可以在掘金上获取最新最优质的技术干货，不仅仅是Android知识、前端、后端以至于产品和设计都有涉猎，想成为全栈工程师的朋友不要错过！

模仿IOS里面的UIActionSheet控件，有IOS6和IOS7两种风格，可以自定义风格，背景图片、按钮图片、文字颜色、间距等。

项目地址：https://github.com/baoyongzhang/ActionSheetForAndroid

使用方法

创建一个ActionSheet并显示

ActionSheet.createBuilder( this , getSupportFragmentManager())
                .setCancelButtonTitle( "Cancel" )
                .setOtherButtonTitles( "Item1" , "Item2" , "Item3" , "Item4" )
                .setCancelableOnTouchOutside( true )
                .setListener( this ).show();

方法说明

• setCancelButtonTitle()设置取消按钮的标题

• setOtherButtonTitles()设置条目，String[]

• setCancelableOnTouchOutside()设置点击空白处关闭

• setListener()设置事件监听器

• show()返回ActionSheet对象，可以调用ActionSheet对象的dismiss()方法手动关闭

事件监听

实现ActionSheetListener接口

• onOtherButtonClick()点击某个条目，index是条目的下标

• onDismiss()关闭事件，isCancel参数表示是否是点击取消按钮、返回键、或者点击空白处(setCancelableOnTouchOutside(true))

@Override
  public void onOtherButtonClick(ActionSheet actionSheet, int index) {
      Toast.makeText(getApplicationContext(), "click item index = " + index,
              0).show();
  }
  @Override
  public void onDismiss(ActionSheet actionSheet, boolean isCancle) {
      Toast.makeText(getApplicationContext(), "dismissed isCancle = " + isCancle, 0).show();
  }

样式

默认的样式非常丑陋，项目中提供了两种Style，可以配置Theme

    <code class="js string">"AppTheme"</code> <code class="js plain">parent=</code> <code class="js string">"AppBaseTheme"</code> <code class="js plain">></code> </div> <div class="line number3 index2 alt2"> <code class="js spaces">        </code> <code class="js plain"><item name=</code> <code class="js string">"actionSheetStyle"</code> <code class="js plain">>@style/ActionSheetStyleIOS6</item></code> </div> <div class="line number4 index3 alt1"> <code class="js spaces">        </code> <code class="js plain">or</code> </div> <div class="line number5 index4 alt2"> <code class="js spaces">        </code> <code class="js plain"><item name=</code> <code class="js string">"actionSheetStyle"</code> <code class="js plain">>@style/ActionSheetStyleIOS7</item></code> </div> <div class="line number6 index5 alt1"> <code class="js spaces">    </code> <code class="js plain">

还可以自定义样式，自定义一个style即可，可以参考ActionSheetStyleIOS6/ActionSheetStyleIOS7的写法

<code class="js string">"ActionSheetStyleIOS7"</code> <code class="js plain">></code> </div> <div class="line number3 index2 alt2"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"actionSheetBackground"</code> <code class="js plain">>@android:color/transparent</item></code> </div> <div class="line number4 index3 alt1"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"cancelButtonBackground"</code> <code class="js plain">>@drawable/slt_as_ios7_cancel_bt</item></code> </div> <div class="line number5 index4 alt2"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"otherButtonTopBackground"</code> <code class="js plain">>@drawable/slt_as_ios7_other_bt_top</item></code> </div> <div class="line number6 index5 alt1"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"otherButtonMiddleBackground"</code> <code class="js plain">>@drawable/slt_as_ios7_other_bt_middle</item></code> </div> <div class="line number7 index6 alt2"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"otherButtonBottomBackground"</code> <code class="js plain">>@drawable/slt_as_ios7_other_bt_bottom</item></code> </div> <div class="line number8 index7 alt1"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"otherButtonSingleBackground"</code> <code class="js plain">>@drawable/slt_as_ios7_other_bt_single</item></code> </div> <div class="line number9 index8 alt2"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"cancelButtonTextColor"</code> <code class="js plain">></code> <code class="js preprocessor">#1E82FF</item></code> </div> <div class="line number10 index9 alt1"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"otherButtonTextColor"</code> <code class="js plain">></code> <code class="js preprocessor">#1E82FF</item></code> </div> <div class="line number11 index10 alt2"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"actionSheetPadding"</code> <code class="js plain">>10dp</item></code> </div> <div class="line number12 index11 alt1"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"otherButtonSpacing"</code> <code class="js plain">>0dp</item></code> </div> <div class="line number13 index12 alt2"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"cancelButtonMarginTop"</code> <code class="js plain">>10dp</item></code> </div> <div class="line number14 index13 alt1"> <code class="js spaces">       </code> <code class="js plain"><item name=</code> <code class="js string">"actionSheetTextSize"</code> <code class="js plain">>12sp</item></code> </div> <div class="line number15 index14 alt2"> <code class="js spaces">   </code> <code class="js plain">

Style属性介绍

• actionSheetBackground背景

• cancelButtonBackground取消按钮背景

• otherButtonTopBackground选项顶部按钮背景

• otherButtonMiddleBackground选项中部按钮背景

• otherButtonBottomBackground选项底部按钮背景

• otherButtonSingleBackground选项只有一个的按钮背景

• cancelButtonTextColor取消按钮的文字颜色

• otherButtonTextColor选项按钮的文字颜色

• actionSheetPadding内边距

• otherButtonSpacing选项按钮的间距

• cancelButtonMarginTop取消按钮顶部间距

• actionSheetTextSize选项按钮文字颜色

收藏 赞(2) 踩(0)

相关文章