slint/internal/compiler/widgets/common/spinner-base.slint

// Copyright © SixtyFPS GmbH <info@slint.dev>
// SPDX-License-Identifier: GPL-3.0-only OR LicenseRef-Slint-Royalty-free-1.1 OR LicenseRef-Slint-commercial

export component SpinnerBase {
    in property <float> progress;
    in property <bool> indeterminate;
    in property <length> stroke-width <=> path.stroke-width;
    in property <brush> stroke <=> path.stroke;

    path := Path {
        private property <float> radius: min(self.viewbox-width, self.viewbox-height) / 2;
        private property <float> start-x: self.viewbox-width / 2;
        private property <float> start-y: self.viewbox-height / 2;
        private property <float> thickness: 2;
        private property <float> inner-radius: self.radius - self.thickness;
        private property <float> start : !indeterminate ? 0 :
            1 * mod(animation-tick(), 3s) / 3s;
        // min is a workaground to get filled circle by 1.0
        private property <float> progress: !root.indeterminate ? min(0.999, root.progress) :
            min(0.99, max(0.25, 1 * abs(sin(360deg * animation-tick() / 1.5s))));

        viewbox-width: 100;
        viewbox-height: 100;
        width: 100%;
        height: 100%;

        MoveTo {
            x: start-x - radius * sin(-path.start * 360deg);
            y: start-y - radius * cos(-path.start * 360deg);
        }

        LineTo {
            x: start-x - path.inner-radius * sin(-path.start * 360deg);
            y: start-y - path.inner-radius * cos(-path.start * 360deg);
        }

        ArcTo {
            radius-x: path.inner-radius;
            radius-y: path.inner-radius;
            x: start-x - path.inner-radius * sin(-(path.start + path.progress) * 360deg);
            y: start-y - path.inner-radius * cos(-(path.start + path.progress) * 360deg);
            sweep: path.progress > 0;
            large-arc: path.progress > 0.5;
        }

        LineTo {
            x: start-x - radius * sin(-(path.start + path.progress) * 360deg);
            y: start-y - radius * cos(-(path.start + path.progress) * 360deg);
        }

        ArcTo {
            radius-x: radius;
            radius-y: radius;
            x: start-x - radius * sin(-path.start * 360deg);
            y: start-y - radius * cos(-path.start * 360deg);
            sweep: path.progress < 0;
            large-arc: path.progress > 0.5;
        }

        LineTo {
            x: start-x - radius * sin(-path.start * 360deg);
            y: start-y - radius * cos(-path.start * 360deg);
        }
    }
}