https://github.com/codingfries/flutter-shapeofview
https://github.com/codingfries/flutter-shapeofview
Last synced: 5 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/codingfries/flutter-shapeofview
- Owner: CodingFries
- License: apache-2.0
- Created: 2021-09-26T16:53:14.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2024-02-22T12:49:21.000Z (over 2 years ago)
- Last Synced: 2024-06-01T01:57:53.901Z (about 2 years ago)
- Language: Dart
- Size: 366 KB
- Stars: 5
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# flutter_shape_of_view
Give a custom shape to any flutter widget, Material Design 2 ready
# Note
This package is a fork of
https://pub.dev/packages/shape_of_view
with added null safety.
I reserve no rights to any of the content.
Hopefully you don't sue me or anything :D I'm just trynna make this package null safe :)
```
dependencies:
shape_of_view:
```
Give a custom shape to any android view
Useful for Material Design 2
[](https://www.github.com/florent37/ShapeOfView)
[](https://www.github.com/florent37/ShapeOfView)
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: YOUR_SHAPE,
elevation: 4,
height: 300, //height & width are optional
child: ...
),
```
# Use implemented shapes
ShapeOfView came with pre-created shapes :
## Circle
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: CircleShape(
borderColor: Colors.white, //optional
borderWidth: 2, //optional
),
child: ...
```
## RoundRect
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: RoundRectShape(
borderRadius: BorderRadius.circular(12),
borderColor: Colors.white, //optional
borderWidth: 2, //optional
),
child: ...
```
## ClipCorner
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: CutCornerShape(
borderRadius: BorderRadius.circular(12);
),
child: ...
```
## Arc
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: ArcShape(
direction: ArcDirection.Outside,
height: 20,
position: ArcPosition.Bottom
),
child: ...
)
```
## Diagonal
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
elevation: 4,
height: 300,
shape: DiagonalShape(
position: DiagonalPosition.Bottom,
direction: DiagonalDirection.Right,
angle: DiagonalAngle.deg(angle: 10)
),
child: ...
)
```
## Triangle
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: TriangleShape(
percentBottom: 0.5,
percentLeft: 0,
percentRight: 0
),
child: ...,
)
```
## Bubble
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: BubbleShape(
position: BubblePosition.Bottom,
arrowPositionPercent: 0.5,
borderRadius: 20,
arrowHeight: 10,
arrowWidth: 10
),
child: ...,
)
```
## Star
[](https://www.github.com/florent37/ShapeOfView)
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: StarShape(
noOfPoints: 5
),
child: ...,
)
```
## Polygon
[](https://www.github.com/florent37/ShapeOfView)
```dart
ShapeOfView(
shape: PolygonShape(
numberOfSides: 9
),
child: ...,
)
```
# Use a custom Shape
```dart
ShapeOfView(
shape: CustomShape(
builder: (rect) => Path()
..moveTo(0, 0)
..close()
),
child: ...,
)
```
or extend Shape
```dart
class MyShape extends Shape {
@override
Path build({Rect rect, double scale}) {
return Path()
..moveTo(0, 0)
..close();
}
}
```
then
```dart
ShapeOfView(
shape: MyShape(),
child: ...,
)
```
## Getting Started with Flutter
For help getting started with Flutter, view our
[online documentation](https://flutter.dev/docs), which offers tutorials,
samples, guidance on mobile development, and a full API reference.
# License
Copyright 2019 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.