Android BottomSheet:便捷易用的底部滑出面板(1)
Android BottomSheet:便捷易用的底部滑出面板(1)
Android BottomSheet是github上的一个第三方开源项目,其主页:https://github.com/Flipboard/bottomsheet
BottomSheet提供了简洁易用的从底部滑出的面板。现在的APP开发,经常需要从底部滑出某些面板提供给用户操作入口,比如最常见的分享,底部滑出一个面板,然后会罗列出多种分享入口,供用户选择。
使用BottomSheet,需要首先在自己的模块build.gradle文件中加入下面代码:
repositories { jcenter() } dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) testCompile 'junit:junit:4.12' compile 'com.android.support:appcompat-v7:23.4.0' compile 'com.flipboard:bottomsheet-core:1.5.1' compile 'com.flipboard:bottomsheet-commons:1.5.1' }
如图:
接下来就可以使用BottomSheet。先写布局。用BottomSheet提供的BottomSheetLayout把自己整个页面包裹起来:
<?xml version="1.0" encoding="utf-8"?> <com.flipboard.bottomsheet.BottomSheetLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/bottomsheet" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:id="@+id/root" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="16dp"> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:text="zhang phil @ csdn" android:id="@+id/editText" /> <Button android:id="@+id/share_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="end" android:text="分享" /> </LinearLayout> </com.flipboard.bottomsheet.BottomSheetLayout>
上层Java代码:
package zhangphil.demo; import android.content.Context; import android.content.Intent; import android.graphics.drawable.Drawable; import android.support.v4.content.res.ResourcesCompat; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.view.inputmethod.InputMethodManager; import android.widget.Button; import android.widget.EditText; import com.flipboard.bottomsheet.BottomSheetLayout; import com.flipboard.bottomsheet.commons.IntentPickerSheetView; import java.util.Collections; import java.util.Comparator; public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); final BottomSheetLayout bottomSheetLayout = (BottomSheetLayout) findViewById(R.id.bottomsheet); final EditText shareText = (EditText) findViewById(R.id.editText); Button shareButton = (Button) findViewById(R.id.share_button); shareButton.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // 隐藏软键盘 InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE); imm.hideSoftInputFromWindow(shareText.getWindowToken(), 0); final Intent shareIntent = new Intent(Intent.ACTION_SEND); shareIntent.putExtra(Intent.EXTRA_TEXT, shareText.getText() + ""); shareIntent.setType("text/plain"); IntentPickerSheetView intentPickerSheet = new IntentPickerSheetView(getApplication(), shareIntent, "分享到...", new IntentPickerSheetView.OnIntentPickedListener() { @Override public void onIntentPicked(IntentPickerSheetView.ActivityInfo activityInfo) { bottomSheetLayout.dismissSheet(); startActivity(activityInfo.getConcreteIntent(shareIntent)); } }); // 过滤到像系统蓝牙这样的分享模式(可以过滤掉也可以不用过滤) /* intentPickerSheet.setFilter(new IntentPickerSheetView.Filter() { @Override public boolean include(IntentPickerSheetView.ActivityInfo info) { return !info.componentName.getPackageName().startsWith("com.android"); } }); */ // 排序分享模块 intentPickerSheet.setSortMethod(new Comparator<IntentPickerSheetView.ActivityInfo>() { @Override public int compare(IntentPickerSheetView.ActivityInfo lhs, IntentPickerSheetView.ActivityInfo rhs) { return rhs.label.compareTo(lhs.label); } }); // 增加一个自定义的分享选择方式(可选) Drawable customDrawable = ResourcesCompat.getDrawable(getResources(), R.mipmap.ic_launcher, null); IntentPickerSheetView.ActivityInfo customInfo = new IntentPickerSheetView.ActivityInfo(customDrawable, "zhang phil custom", getApplicationContext(), MainActivity.class); intentPickerSheet.setMixins(Collections.singletonList(customInfo)); bottomSheetLayout.showWithSheetView(intentPickerSheet); } }); } }
分享的button按钮触发弹出分享面板,分享面板可以向上拖曳铺满。
代码运行初始化:
点击分享按钮弹出分享面板:
拖曳分享面板向上铺满窗口:
附录文章:
1,《Android自底部平滑向上滑出面板的AndroidSlidingUpPanel》链接地址:http://blog.csdn.net/zhangphil/article/details/51444509
2,《Android音乐、视频类APP常用控件:DraggablePanel(1)》链接地址:http://blog.csdn.net/zhangphil/article/details/51566860
3,《Android音乐、视频类APP常用控件:DraggablePanel(2)》链接地址:http://blog.csdn.net/zhangphil/article/details/51578665