🏃 BGATransformersTip-Android🏃
Android 通用 PopupWindow，支持从锚点控件的各个位置弹出浮窗，可以配置箭头指示器展示到浮窗边缘的任意位置
效果图
使用说明
添加 Gradle 依赖
dependencies {
implementation 'cn.bingoogolapple:bga-transformerstip:latestVersion@aar'
}方式一：在 Java 代码中设置浮窗位置、浮窗背景、箭头位置
- 添加浮窗布局文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="16dp"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:background="@color/colorPrimaryDarkTrans"
android:gravity="center_vertical"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_tip_content"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:text="这里 paddingBottom 比其他 padding 多了 6pd 是为了留空间给三角箭头"
android:textColor="@android:color/white" />
<TextView
android:id="@+id/tv_tip_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_gravity="top"
android:padding="4dp"
android:text="X"
android:textColor="@android:color/white" />
</LinearLayout>- 在 Java 代码中设置浮窗位置、浮窗背景、箭头位置
new TransformersTip(anchorView, R.layout.layout_demo1_tip) {
@Override
protected void initBackground(View contentView) {
// 在 Java 代码中设置浮窗背景以及箭头位置
new ArrowDrawable(contentView)
.setArrowGravity(ArrowGravity.TO_BOTTOM_CENTER) // 设置箭头相对于浮窗的位置
.setBgColorRes(R.color.colorPrimaryDarkTrans) // 设置背景色
.setArrowHeightDp(6) // 设置箭头高度
.setRadiusDp(4) // 设置浮窗圆角半径
.setArrowOffsetXDp(0) // 设置箭头在 x 轴的偏移量
.setArrowOffsetYDp(0); // 设置箭头在 y 轴的偏移量
}
@Override
protected void initView(View contentView) {
// 点击浮窗中自定按钮关闭浮窗
contentView.findViewById(R.id.tv_tip_close).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dismiss();
}
});
}
}.setTipGravity(TipGravity.TO_TOP_CENTER) // 设置浮窗相对于锚点控件展示的位置
.setTipOffsetXDp(0) // 设置浮窗在 x 轴的偏移量
.setTipOffsetYDp(0) // 设置浮窗在 y 轴的偏移量
.show(); // 显示浮窗方式二：在 Java 代码中设置浮窗位置，在布局文件中设置浮窗背景、箭头位置
- 添加浮窗布局文件，在布局文件中设置浮窗背景、箭头位置。优点是可以提前预览效果
<?xml version="1.0" encoding="utf-8"?>
<cn.bingoogolapple.transformerstip.view.TransformersTipLinearLayout 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:paddingTop="16dp"
android:paddingBottom="10dp"
android:paddingStart="10dp"
android:paddingEnd="10dp"
android:gravity="center_vertical"
android:orientation="horizontal"
app:ad_arrowExtraOffsetX="0dp"
app:ad_arrowExtraOffsetY="0dp"
app:ad_arrowGravity="to_top_center"
app:ad_arrowHeight="6dp"
app:ad_background="@color/colorPrimaryDarkTrans"
app:ad_radius="4dp">
<TextView
android:id="@+id/tv_tip_content"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:text="这里 paddingTop 比其他 padding 多了 6pd 是为了留空间给三角箭头"
android:textColor="@android:color/white" />
<TextView
android:id="@+id/tv_tip_close"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_gravity="top"
android:padding="4dp"
android:text="X"
android:textColor="@android:color/white" />
</cn.bingoogolapple.transformerstip.view.TransformersTipLinearLayout>- 在 Java 代码中设置浮窗位置
new TransformersTip(anchorView, R.layout.layout_demo2_tip) {
@Override
protected void initView(View contentView) {
// 点击浮窗中自定按钮关闭浮窗
contentView.findViewById(R.id.tv_tip_close).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dismiss();
}
});
}
}.setTipGravity(TipGravity.TO_BOTTOM_CENTER) // 设置浮窗相对于锚点控件展示的位置
.setTipOffsetXDp(0) // 设置浮窗在 x 轴的偏移量
.setTipOffsetYDp(0) // 设置浮窗在 y 轴的偏移量
.show(); // 显示浮窗TipGravity 说明
- 通过 TipGravity.xxxx 来设置浮窗相对于锚点控件展示的位置
ArrowGravity 说明
- 通过 ArrowGravity.xxxx 来设置箭头相对于浮窗的位置
TransformersTipLinearLayout 和 TransformersTipRelativeLayout 自定义属性说明
<declare-styleable name="ArrowDrawable">
<!-- 背景 -->
<attr format="reference|color" name="ad_background" />
<!-- 箭头高度 -->
<attr format="dimension" name="ad_arrowHeight" />
<!-- 浮窗圆角半径 -->
<attr format="dimension" name="ad_radius" />
<!-- 箭头在 x 轴的偏移量 -->
<attr format="dimension" name="ad_arrowExtraOffsetX" />
<!-- 箭头在 y 轴的偏移量 -->
<attr format="dimension" name="ad_arrowExtraOffsetY" />
<!-- 箭头相对于浮窗的位置 -->
<attr name="ad_arrowGravity">
<flag name="to_top_align_start" value="65" />
<flag name="to_top_center" value="129" />
<flag name="to_top_align_end" value="257" />
<flag name="align_top_to_start" value="34" />
<flag name="align_top_to_end" value="514" />
<flag name="center_to_start" value="36" />
<flag name="center_to_end" value="516" />
<flag name="align_bottom_to_start" value="40" />
<flag name="align_bottom_to_end" value="520" />
<flag name="to_bottom_align_start" value="80" />
<flag name="to_bottom_center" value="144" />
<flag name="to_bottom_align_end" value="272" />
</attr>
</declare-styleable>代码是最好的老师，更多详细用法请查看 demo🐾
关于我
| 个人主页 | 邮箱 | BGA系列开源库QQ群 |
|---|---|---|
| bingoogolapple.cn | [email protected] |  |
打赏支持
如果您觉得 BGA 系列开源库帮你节省了大量的开发时间，请扫描下方的二维码随意打赏，要是能打赏个 10.24 
如果您目前正打算购买通往墙外的梯子，可以使用我的邀请码「YFQ9Q3B」购买 Lantern，双方都赠送三个月的专业版使用时间
License
Copyright 2019 bingoogolapple
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent