Usage

support Right to Left

if you want to add Right to Left language (like Arabic) just use app:sv_textRightToLeft="true" attribute in XML, and speedometerTextRightToLeft = true in code.
look at the text in this image:

Speed Text Position

unit Text always attached to speed Text, you can change position using sv_speedTextPosition Attribute, in your XML:

app:sv_speedTextPosition="TOP_LEFT"

in the Code:

speedometer.speedTextPosition = Gauge.Position.CENTER

this image show you where could put speed-unit Text:

also you can use sv_unitUnderSpeedText="true".

Start and End Degree

just for Speedometer family.

you can change the default start degree 135 and End Degree 405 easily.\

in XML use app:sv_startDegree and app:sv_endDegree attributes :

app:sv_startDegree="180"
app:sv_endDegree="360"

in code use setStartDegree(int) and setEndDegree(int) methods :

speedometer.setStartDegree(180)
speedometer.setEndDegree(270)

Control division of the speedometer

just for Speedometer family.

since version 1.5.0 you can add any number of sections, whenever you want, fully customized.

lets start with easy way to add 5 sections equal to each others:

speedometer1.makeSections(5, Color.CYAN, Style.BUTT)
// this is very simple way to add sections,
// if your speedometer has 0-100 speed rage
// that means every section has '20' speed-unit in space.

// you can change colors to every:
speedometer1.sections[0].color = Color.GREEN
speedometer1.sections[1].color = Color.BLUE
speedometer1.sections[2].color = Color.RED
...

here you noticed that we add Style.BUTT style to our section, there is also Style.ROUND style, try it yourself.

to get all sections call speedometer.sections
sections is an array of Section that hold all your sections, it is read-only don't try to add new section to the list immediately by call speedometer.sections.add(Section(..)).
to add new section to existing sections, use this:

// .9f(90%) start of the section.
// 1f(100%) ends of the section. 
val myNewSection = Section(.9f, 1f, Color.BLUE, speedometer2.speedometerWidth, Style.ROUND)
speedometer2.addSections(myNewSection)

first we create Section with its constructor, 1st parameter is startOffset it must be between [0-1] it means [0% to 100%], in our example 90%, 2nd parameter is endOffset.
then the color, and section width, finaly section style. be careful, if there is any section in speedometer2 exists between [(90%)->(100%)] you will have IllegalArgumentException cause of the conflict between tow sections.

lets have an example to have a speedometer with sections [10%, 40%, 75%, 90%] and we don't need any section between 90%->100%.

// first remove all old sections.
speedometer3.clearSections()
speedometer3.addSections(Section(0f, .1f, Color.LTGRAY)
        , Section(.1f, .4f, Color.YELLOW)
        , Section(.4f, .75f, Color.BLUE)
        , Section(.75f, .9f, Color.RED))
// be aware, we didn't add Section(.9f, 1f, ..) because we need it empty.

to remove particular section call speedometer.removeSection(section).
you can get a callback when indicator move to new section with OnSectionChangeListener.\

Observable Section

when you want to change the color or speedOffset to a particular section, you can immediately call speedometer.sections[0].color =.. without tack care of invalidate the SpeedView, because it's observing any change to sections and do auto invalidate.
and for that reason, you mustn't add one section to two speedometers.

Speedometer Modes

just for Speedometer family.

if you want to change indicator's position, or make semi-circular Gauge ...., you need to change sv_speedometerMode, this image tell you what sv_speedometerMode can do:

change speedometerMode in XML:

app:sv_speedometerMode="TOP"

in the Code:

speedometer.speedometerMode = Speedometer.Mode.TOP_LEFT

Light Effect

since v1.2.0, you can add light effect behind the indicator like this:

if you like to use this effect just use sv_withIndicatorLight="true" and you can customize its color sv_indicatorLightColor="#BB0000FF" or in your code by its methods.

for Light Effect Color add some transparent to make the effect as light (recommend #BB in hex).

Ticks

just like AwesomeSpeedometer, since V 1.1.5 you can add labels at each tick points.

simply, you must specify the number of ticks and the library will calculate its values and positions.

in XML use sv_tickNumber attribute like this:

<com.github.anastr.speedviewlib.SpeedView
        android:id="@+id/speedometer"
        android:layout_width="250dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        app:sv_tickNumber="6"/>

in your Code:

speedometer.tickNumber = 10

by defult, AwesomeSpeedometer has TickNumber = 9.

Custom Ticks

you can add custom ticks at custom speed value, like so:

//                              0%   25%   50%  75%  100%
speedometer.ticks = arrayListOf(0f, .25f, .5f, .75f, 1f)

ticks expect a list of offset points in range [0f-1f].
if your min-max speed is 0-100 and you want custom tick at 50 simply add .5f to ticks.
you don't have to add them in order, for Ex (0f, .7f, .5f, .8f) is fine.

Custom Tick Label

you can add simple label to each tick in your speedometer, just use OnPrintTickLabel interface. for Example: we want to change tick 1000 to 1 km.

speedometer.onPrintTickLabel = { tickPosition: Int, tick: Float ->
    if (tick >= 1000)
        String.format(Locale.getDefault(), "%.1f Km", tick / 1000f)
    else
        null
    // null means draw default tick label.
    // also you can return SpannableString to change color, textSize, lines...
}

this will draw n M before 1000 value, and n Km when value>=1000.

tickPadding

if you don't like its position you can change padding value easily using sv_tickPadding="10dp", or speedometer.tickPadding = 15 in code.

We recommended to leave it at default value.