Search code examples
androidmathwatch-face-api

How can I make quarter indicators in Android Wear Watch Face?


It's no secret. My math skills aren't that impressive.

I'm developing my own Wear Watchface. But I want to draw a Drawline to the center of the screen for every 10 minute place on the watch. (See the 500px analog example).

By using the Google example code I can achieve this but only an entire line from the side of the screen to the center. But I want it to be like 5% (or a fixed amount of pixels) in length of that like in the 500px watchface. This is Google's code for drawing the second dial:

float centerX = width / 2f;
float centerY = height / 2f;

float secRot = mTime.second / 30f * (float) Math.PI;
float secLength = centerX - 20;

float secX = (float) Math.sin(secRot) * secLength;
float secY = (float) -Math.cos(secRot) * secLength;
canvas.drawLine(centerX, centerY, centerX + secX, centerY + secY, mHandPaint);

By changing the mTime.second I can draw from a specific second.


Solution

  • Found the solution, here's a snippet:

        int teller_minuut_stip = 0; //Current minute
    
        float secRot_stip = teller_minuut_stip / 30f * (float) Math.PI;
        float secRot_stip_klein = teller_minuut_stip / 30f * (float) Math.PI;
    
        float secLength_stip = centerX - 10;
                float secX = (float) Math.sin(secRot_stip) * secLength_stip;
                float secY = (float) -Math.cos(secRot_stip) * secLength_stip;
    
                float secLength_stip_klein = centerX - 140;
                float secX_klein = (float) Math.sin(secRot_stip_klein) * secLength_stip_klein;
                float secY_klein = (float) -Math.cos(secRot_stip_klein) * secLength_stip_klein;
    
                float eindpunt_x = centerX + secX;
                float eindpunt_y = centerY + secY;
    
                float lijn_x = eindpunt_x - secX_klein;
                float lijn_y = eindpunt_y - secY_klein;
    
            canvas.drawLine(eindpunt_x, eindpunt_y, lijn_x, lijn_y, datePaint_cirkel_kleurtien);