Android开源BubbleLayout控件 - 一个可自定义样式的气泡提示
QuincyCalvi
9年前
<p>一个可以自定义线条,颜色,箭头大小位置和方向的气泡提示。</p> <h2>效果</h2> <p><img src="https://simg.open-open.com/show/585b8a8fbddf4141eae68455dced6a38.gif"></p> <h2>Gradle</h2> <p>Add the dependency to your build.gradle.</p> <pre> <code class="language-xml">dependencies { compile 'com.daasuu:BubbleLayout:1.0.0' } </code></pre> <h2>基本使用</h2> <p><img src="https://simg.open-open.com/show/077639db12b044e4dc114e1e82305d69.png"></p> <p>Include the BubbleLayout widget in your layout.</p> <pre> <code class="language-xml"><com.daasuu.bl.BubbleLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="12dp" android:padding="8dp" app:bl_arrowDirection="right" app:bl_arrowHeight="8dp" app:bl_arrowPosition="16dp" app:bl_arrowWidth="8dp" app:bl_cornersRadius="6dp" app:bl_strokeWidth="1dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginRight="4dp" android:text="BubbleLayout" android:textColor="@android:color/holo_red_dark" /> </com.daasuu.bl.BubbleLayout></code></pre> <h2>属性</h2> <p>There are several attributes you can set:</p> <table> <thead> <tr> <th>attr</th> <th>description</th> </tr> </thead> <tbody> <tr> <td>bl_arrowWidth</td> <td>Width of the arrow, default 8dp</td> </tr> <tr> <td>bl_arrowHeight</td> <td>Height of the arrow, default 8dp</td> </tr> <tr> <td>bl_arrowPosition</td> <td>Position of the arrow, default 12dp</td> </tr> <tr> <td>bl_cornersRadius</td> <td>Corner radius of the BubbleLayout, default 0dp</td> </tr> <tr> <td>bl_bubbleColor</td> <td>Color of the BubbleLayout, default WHITE</td> </tr> <tr> <td>bl_strokeWidth</td> <td>Width of the stroke, default 0dp</td> </tr> <tr> <td>bl_strokeColor</td> <td>Color of the stroke, default GLAY</td> </tr> <tr> <td>bl_arrowDirection</td> <td>Drawing position of the arrow : 'left' or 'top' or 'right' or 'bottom', default 'left'</td> </tr> </tbody> </table> <h2>例子</h2> <p><img src="https://simg.open-open.com/show/b256c006e6eda4b5cb7d3b2a0525245d.png"></p> <pre> <code class="language-xml"><com.daasuu.bl.BubbleLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="12dp" android:padding="8dp" app:bl_arrowDirection="top" app:bl_arrowHeight="8dp" app:bl_arrowPosition="12dp" app:bl_arrowWidth="8dp" app:bl_bubbleColor="@android:color/holo_blue_light" app:bl_cornersRadius="8dp"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal"> <ImageView android:layout_width="20dp" android:layout_height="20dp" android:src="@mipmap/ic_launcher" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginLeft="4dp" android:text="BubbleLayout" android:textColor="@android:color/holo_red_dark" /> </LinearLayout> </com.daasuu.bl.BubbleLayout></code></pre> <p><img src="https://simg.open-open.com/show/c5d79ee1742797c1b6fb8d1e66e5741f.png"></p> <pre> <code class="language-xml"><com.daasuu.bl.BubbleLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="8dp" app:bl_arrowDirection="left" app:bl_arrowHeight="8dp" app:bl_arrowPosition="16dp" app:bl_arrowWidth="8dp" app:bl_strokeWidth="1dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginRight="4dp" android:text="BubbleLayout" android:textColor="@android:color/holo_red_dark" /> </com.daasuu.bl.BubbleLayout></code></pre> <p><img src="https://simg.open-open.com/show/18955a8669e8ee00a0e178f00db5021a.gif"></p> <pre> <code class="language-java">Button button = (Button) findViewById(R.id.btn_popup); BubbleLayout bubbleLayout = (BubbleLayout) LayoutInflater.from(this).inflate(R.layout.layout_sample_popup, null); PopupWindow popupWindow = BubblePopupHelper.create(this, bubbleLayout); button.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { int[] location = new int[2]; v.getLocationInWindow(location); popupWindow.showAtLocation(v, Gravity.NO_GRAVITY, location[0], v.getHeight() + location[1]); } });</code></pre> <p>layout_sample_popup.xml</p> <pre> <code class="language-xml"><?xml version="1.0" encoding="utf-8"?> <com.daasuu.bl.BubbleLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="@dimen/activity_horizontal_margin" app:bl_arrowDirection="top" app:bl_arrowHeight="12dp" app:bl_arrowPosition="16dp" app:bl_arrowWidth="8dp" app:bl_bubbleColor="@color/colorAccent" app:bl_cornersRadius="2dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_marginRight="4dp" android:text="BubbleLayout Popup" android:textColor="@android:color/white" /> </com.daasuu.bl.BubbleLayout></code></pre> <h2> </h2>