【开源】DraggableFlagView

DraggableFlagView

• 项目地址： https://github.com/wangjiegulu/DraggableFlagView

  介绍：

  可拖拽的红点，（仿新版QQ，tab下面拖拽标记为已读的效果），拖拽一定的距离可以消失回调。

  运行效果：

 

使用说明：

实现原理：

当根据touch事件的移动，不断调用onDraw()方法进行刷新绘制。

*注意：这里原来的小红点称为红点A；根据手指移动绘制的小红点称为红点B。

touch事件移动的时候需要处理的逻辑：

1. 红点A的半径根据滑动的距离会不断地变小。

2. 红点B会紧随手指的位置移动。

3. 在红点A和红点B之间需要用贝塞尔曲线绘制连接区域。

4. 如果红点A和红点B之间的间距达到了设置的最大的距离，则表示，这次的拖拽会有效，一旦放手红点就会消失。

5. 如果达到了第4中情况，则红点A和中间连接的贝塞尔曲线不会被绘制。

6. 如果红点A和红点B之间的距离没有达到设置的最大的距离，则放手后，红点B消失，红点A从原来变小的半径使用反弹动画变换到原来最初的状态

main.xml

1 2 3 4 5 6 7 8 9

<com.wangjie.draggableflagview.DraggableFlagView                 xmlns:dfv="http://schemas.android.com/apk/res/com.wangjie.draggableflagview"                 android:id="@+id/main_dfv"                 android:layout_width="20dp"                 android:layout_height="20dp"                 android:layout_alignParentBottom="true"                 android:layout_margin="15dp"                 dfv:color="#FF3B30"                 />

MainActivity:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27

public class MainActivity extends Activity implements DraggableFlagView.OnDraggableFlagViewListener, View.OnClickListener {           @Override         public void onCreate(Bundle savedInstanceState) {             super.onCreate(savedInstanceState);             setContentView(R.layout.main);             findViewById(R.id.main_btn).setOnClickListener(this);               DraggableFlagView draggableFlagView = (DraggableFlagView) findViewById(R.id.main_dfv);             draggableFlagView.setOnDraggableFlagViewListener(this);             draggableFlagView.setText("7");         }           @Override         public void onFlagDismiss(DraggableFlagView view) {             Toast.makeText(this, "onFlagDismiss", Toast.LENGTH_SHORT).show();         }           @Override         public void onClick(View v) {             switch (v.getId()) {                 case R.id.main_btn:                     Toast.makeText(this, "hello world", Toast.LENGTH_SHORT).show();                     break;             }         }     }

 

相关代码

• BezierDemo
• SpringIndicator