##SupernatantView

  • If MY English is good, this should be called the view floating on top – the bootstrap layer
  • Today, I have nothing to do to see some guide layer cases on the Internet total feeling if not very comfortable, is similar to the very rigid show and disappear
  • I was wondering if I could animate it to make it look more comfortable so I came up with this GIF. It’s a little short but I can’t get it too long. Github didn’t upload it and I don’t know if I’m doing it right
Markdown

  • The initial click on the screen didn’t respond because I blocked the click event and you can see it in the code
  • Because our product wang has no such requirements So I write some places is not very serious Including the indicating arrow below if the distance is not enough arrows I don’t have to do judgment Just write the general meaning You if want to change can see inside the comment (secretly tell you comment more inside Afraid of you don’t understand)

  • step 1

    Inherits the View override constructor and the onTouchEvent and Draw methods

       public SupernatantView(Context context) {
          this(context, null);
      }

      public SupernatantView(Context context, AttributeSet attrs) {
              this(context, attrs, 0);
      }

      public SupernatantView(Context context, AttributeSet attrs, int defStyleAttr) {
          super(context, attrs, defStyleAttr);

      }Copy the code

    Ontouch method

          @Override
  protected void onDraw(Canvas canvas) {
      super.onDraw(canvas);
  }Copy the code

    OnTouchEvent method

           @Override
      public boolean onTouchEvent(MotionEvent event) {

  //        return super.onTouchEvent(event);
  return true; // Block click events}Copy the code

  • step 2

    The initialization brush method is extracted separately

    private Paint createPaint(int paintColor, int alpha, int textSize, Paint.Style style, int linWidth) { Paint paint = new Paint(); // Initialize paint.setantiAlias (true); // Antialiasing paint.setdither (true); SetStrokeCap (paint.cap.round); SetStrokeJoin (paint.join.round); Paint. SetColor (paintColor); // Set the color paint. SetAlpha (alpha); // Set transparency paint.settextSize (textSize); // Set the text size paint.setstyle (style); // Set the style paint.setstrokeWidth (linWidth); // Set the edge widthreturn paint;
      }    Copy the code

  • step 3

    Initialize various values including the screen width and height status bar

        public static int[] getScreenSize(Context context) {
  DisplayMetrics metrics = new DisplayMetrics();
  WindowManager windowManager = (WindowManager) context.getSystemService(Context.WINDOW_SERVICE);
  windowManager.getDefaultDisplay().getMetrics(metrics);
  return new int[]{metrics.widthPixels, metrics.heightPixels};
      }

   public static int getStatusBarHeight() {
  return Resources.getSystem().getDimensionPixelSize(
          Resources.getSystem().getIdentifier("status_bar_height"."dimen"."android"));
      }Copy the code

  • step 4

    Some basic methods include obtaining the screen coordinates of the view, and obtaining the RectF of the view. There will be detailed comments in the code to show you a picture first

Markdown

  • step 5

    I’m just going to rewrite the onDraw method and compute some dynamic data and stuff like that and I’m not going to post it if you’re interested

Github Hot Wheels :github.com/guanhaoran/…

QQ 765307272