Repository files navigation

🎨 Need to create a custom view ?

You don't know how to use Canvas, use MyLittleCanvas instead !

Codes :

• Animated arcs
• Animated dots
• Custom Slider
• Tree
• Custom Switch
• Custom RadioButton

dependencies {compile'com.github.florent37:mylittlecanvas:2.0.2'}

TODO : NEED TO FILL THOSE DOCUMENTATIONS

Follow the example ofSwitchView

Shape animations are executed by an instance ofShapeAnimator attached to your view

privatefinalShapeAnimatorshapeAnimator =newShapeAnimator(this);

All animated methods of shapes are wrapped into the method.animate()

For example, for aCircleShape, you can animate his position (centerX) using

myCircleShape.animate().centerXTo(15);

Then use yourShapeAnimator to execute this animation

shapeAnimator.play(myCircleShape.animate().centerXTo(15))    .setDuration(500)    .start()

This method will change the shapetop values,ignoring its previous height

For example, for a Rect[left: 0, top:50, right: 200, bottom:90]

if you use.animate().top(50, 0)

The final values of the Rect will be[left: 0, top:50, right: 200, bottom:90] then[left: 0, top:0, right: 200, bottom:90],it will not change the bottom of the rect

It's the same astop except it automatically set the first value as the current value

For example, for a Rect[left: 0, top:50, right: 200, bottom:90]

if you use.animate().topTo(0), it will animate the top from50 to0

This method will change the shapetop value,keeping the shape height

For example, for a Rect[left: 0, top:10, right: 200, bottom:90], the height is80

if you use.animate().moveTop(0)

The final values of the Rect will be[left: 0, top:0, right: 200, bottom:80],it will also change the bottom of the rect to keep the height of 80

This method will change the shapetop value,ignoring its previous height

Multiplying his top by the values

For example, for a Rect[left: 0, top:10, right: 200, bottom:90]

if you use.animate().topBy(0, 0.5, 1f)

The values of the Rect will be

[left: 0, top:0, right: 200, bottom:90] then

[left: 0, top:5, right: 200, bottom:90] then

[left: 0, top:10, right: 200, bottom:90]

it will not change the bottom of the rect

This method will change the shapetop value,ignoring its previous height

Adding his top by the values

For example, for a Rect[left: 0, top:10, right: 200, bottom:90]

if you use.animate().topPlus(0, 10, 0)

The values of the Rect will be

[left: 0, top:10, right: 200, bottom:90] then

[left: 0, top:20, right: 200, bottom:100] then

[left: 0, top:10, right: 200, bottom:90]

it will not change the bottom of the rect

Follow the example ofTree View

User events handling likeonClick oronTouch are handled by an instance ofShapeEventManager attached to your view

privatefinalShapeEventManagershapeAnimator =newShapeEventManager(this);

You can listen for a shape click usingshapeEventManager.ifClicked(shape, listener)

shapeEventManager.ifClicked(myShape,clickedShape -> {//your actionmyShape.setColor(Color.BLACK);});

To handle easier the onTouchEvent, useshapeEventManager.ifClicked(shape, touchSetup)

The touchSetup gives you an itemEventHelper, which help you bind an action with an user interaction

UseeventHelper.onDown((event) -> {/* code */}) to execute a custom action to execute on user finger down

UseeventHelper.onMove((event) -> {/* code */}) to execute a custom action to execute on user finger move

UseeventHelper.onUp((event) -> {/* code */}) to execute a custom action to execute on user finger up

EventHelper can automatically bind a shape action to an user interaction

For example, you can move move theCenterX of a shape to the event.x using

.move(myRectShape,RectShape.Pos.CENTER_X,EventPos.X)

Please look at implementedRectShape.Pos andCircleShape.Pos

We welcome your contributions to this project.

You can submit any idea or improvement for this project.

The best way to submit a patch is to send us apull request.

To report a specific problem or feature request, open a new issue on Github.

Author: Florent Champigny

Blog :http://www.tutos-android-france.com/

Fiches Plateau Moto :https://www.fiches-plateau-moto.fr/

Copyright 2018 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.0Unless required by applicable law or agreed to in writing, softwaredistributed 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 andlimitations under the License.