c# Resize Ellipse - stay centered

[James Rose]

I'm working on a audio visualization (some info: https://www.neowin.net/forum/topic/1185035-c-audio-spectrumfft-win8-store-apps/ ) and I have a set of ellipse that have to be placed via code (need for random) and the size of the ellipse is based on the data coming back from the audio player (again, see the above link)

 

I have tried several approaches but all of them have the ellipse "shaking" as the center point gets adjusted by the width and height, which is a double value ( divided by two to get the center)  Because the double value can be a deep decimal point 0.000587897 (etc) the center keeps changing slightly.

 

This does not, and should not animate as the values returned by the audio player come back every 60th of a second.  I looked at ScaleTransform, but either I am screwing it up (likely) or...  I just don't know.

 

Any clues?

[Andre S. Veteran]

It's likely you're running into precision issues because the numbers are so small. Try scaling up everything in your calculations and then scaling back down to the values you want.

[Eric Veteran]

Have you looked into using a Path and EllipseGeometry instead? You can specify center and X/Y radius that way.

[James Rose]

It's likely you're running into precision issues because the numbers are so small. Try scaling up everything in your calculations and then scaling back down to the values you want.

 

Yes that is an issue, the values returning are Floats and I have to multiply them to a higher value for display.  Because of this the Left and Top properties vary by at least 1 pixel.   I did find this code (in XAML) that I will look at in a day or two to see if it will work for my needs

 <Grid Width="100" Height="100">
            <AdornerDecorator>
                <Ellipse
                x:Name="myEllipse"
                Width="{Binding Path=Value, ElementName=mySlider}"
                Height="{Binding Path=Value, ElementName=mySlider}"
                Fill="AliceBlue"
                RenderTransformOrigin="0.5 0.5"
                Stroke="Aquamarine">
                    <Ellipse.RenderTransform>
                        <RotateTransform Angle="{Binding Path=Value, ElementName=myRotationSlider}"/>
                    </Ellipse.RenderTransform>
                </Ellipse>
            </AdornerDecorator>
        </Grid>
        <Slider
        x:Name="mySlider"
        Width="100"
        Canvas.Left="150"
        Canvas.Top="10"
        Maximum="100"
        Minimum="0"
        Value="10"/>