Gogledd-Orllewin

Log

Compose

Histogram

Simple display of a series of values, used in Lento 4 as a histogram display before being removed.

package io.orllewin.lento4.ui.bottom_controls

import androidx.compose.foundation.Canvas
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.width
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import kotlin.math.cos
import kotlin.math.max
import kotlin.math.sin

@Composable
fun Histogram(
    values: IntArray,
    modifier: Modifier = Modifier
) {
    Canvas(modifier = modifier) {
        if (values.isEmpty()) return@Canvas

        val maxValue = max(values.max(), 1).toFloat()
        val columnWidth = size.width/(values.size - 1)
        val height = size.height
        val colour = Color.Black.copy(alpha = 0.4f)

        values.forEachIndexed { index, value ->
            val x = index * columnWidth
            val y = height - (value / maxValue) * height
            drawLine(
                color = colour,
                strokeWidth = columnWidth,
                start = Offset(x, y),
                end = Offset(x, height)
            )
        }
    }
}

@Preview
@Composable
fun HistogramPreview(){
    val points = mutableListOf()
    repeat(100){ index ->
        points.add((cos(index / 15.0) * 100).toInt() + (sin(index / 25.0) * 100).toInt())
    }
    Box(
        modifier = Modifier.background(Color.White)
    ) {
        Histogram(
            values = points.toIntArray(),
            modifier = Modifier.width(400.dp).height(200.dp)
        )
    }
}