android视图project视图,ShapeOfView - 为任何Android视图提供自定义形状

ShapeOfView

Give a custom shape to any android view Useful for Material Design 2

Download

dependencies {

implementation 'com.github.florent37:shapeofview:(lastest version)'

}

Sample

What you can do with Shape Of View :

Use implemented shapes

ShapesOfView came with pre-created shapes :

Circle

android:layout_width="150dp"

android:layout_height="150dp"

android:elevation="4dp"

app:shape_circle_borderColor="@android:color/black"

app:shape_circle_borderWidth="2dp">

RoundRect

android:layout_width="150dp"

android:layout_height="100dp"

android:elevation="4dp"

app:shape_roundRect_bottomLeftRadius="10dp"

app:shape_roundRect_bottomRightRadius="10dp"

app:shape_roundRect_topLeftRadius="10dp"

app:shape_roundRect_topRightRadius="10dp"

app:shape_roundRect_borderColor="@android:color/black"

app:shape_roundRect_borderWidth="2dp"

>

ClipCorner

android:id="@+id/clipCorner"

android:layout_width="150dp"

android:layout_height="100dp"

android:elevation="4dp"

app:shape_cutCorner_bottomRightSize="20dp">

Arc

android:layout_width="150dp"

android:layout_height="100dp"

android:elevation="4dp"

app:shape_arc_cropDirection="outside"

app:shape_arc_height="20dp"

app:shape_arc_position="bottom"

>

Diagonal

android:layout_width="150dp"

android:layout_height="100dp"

android:elevation="4dp"

app:shape_diagonal_angle="10"

app:shape_diagonal_direction="left"

app:shape_diagonal_position="bottom">

Triangle

android:layout_width="150dp"

android:layout_height="150dp"

android:elevation="4dp"

app:shape_triangle_percentBottom="0.5"

app:shape_triangle_percentLeft="0"

app:shape_triangle_percentRight="0">

Bubble

android:layout_width="150dp"

android:layout_height="150dp"

app:shape_bubble_arrowHeight="10dp"

app:shape_bubble_arrowWidth="10dp"

app:shape_bubble_arrowPosition="bottom"

app:shape_bubble_borderRadius="20dp"

>

Star

android:layout_width="150dp"

android:layout_height="150dp"

app:shape_star_noOfPoints="5">

Polygon

android:layout_width="150dp"

android:layout_height="100dp"

app:shape_polygon_noOfSides="9"

>

Animation

All shapes methods can be animated

For example, you can animate a RoundRect corner :

ValueAnimator.ofFloat(0f, 200f, 0f).apply {

addUpdateListener { animation -> roundRect.bottomLeftRadius = (animation.animatedValue as Float).toInt() }

duration = 800

repeatCount = ValueAnimator.INFINITE

repeatMode = ValueAnimator.REVERSE

}.start()

Create you own shape

You can use custom shape to cut your view

Using Drawable (no elevation)

android:layout_width="100dp"

android:layout_height="100dp"

app:shape_clip_drawable="@drawable/YOUR_DRAWABLE"

>

Using Path (with elevation)

This method generates also a shadow path (with Lollipop elevation API 21+)

Wrap your view with a ShapeOfView

android:id="@+id/myShape"

android:layout_width="30dp"

android:layout_height="15dp"

android:elevation="6dp">

Then generate a path in your code :

ShapeOfView shapeOfView = findViewById(R.id.myShape)

shapeOfView.setClipPathCreator(new ClipPathManager.ClipPathCreator() {

@Override

public Path createClipPath(int width, int height) {

final Path path = new Path();

//eg: triangle

path.moveTo(0, 0);

path.lineTo(0.5 * width, height);

path.lineTo(width, 0);

path.close();

return path;

}

});

Contribute

Feel free to fork this project, and add customs shapes

Then make a merge-request after updated the README with a sample of your shape, including a preview

TODO

HISTORY

1.3.2 Backport of 1.3.0 for api 14+

1.3.0 Fixed rendering on android API 28+

1.2.0 Removed bitmap usage in a lot of usecases (diagonal, arc, roundrect, circle)

1.1.0 Disabled setBackground on ShapeOfView

1.0.9 Added requiresShapeUpdate(), allowing animations to work, look at AnimationActivity

1.0.8 Used arcTo instead of quads in RoundRect, added border to RoundRect

1.0.7 Prefixed all attributes by shape_

1.0.6 Updated roundrect implementation

1.0.5 Enable hardware acceleration after clip view

1.0.4 Added PolygonView

1.0.2 Added StarView

1.0.1 Added BubbleView

Credits

Ed Sheeran, for the name of this project and his awesome songs <3

License

Copyright 2017 Florent37, Inc.

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.