1
votes

I know this type of question has been asked before, But I have tried the suggestions to no avail, so hopefully some fresh eyes can help me on this.

I have a Custom Control, which is basically a Border with a grid inside which contains 2 textboxes and a button.

The control also has a octagon that is added in codebehind.

The button's click event does not fire. I gather it has probably got something to do with the controls above it getting the click event instead of the Button, but I don't know how to solve it. Or perhaps because the octagon is drawn afterwards in the code behind.

I have tried so many different things, moving the button, adding another grid, setting the background to Transparent. This is driving me nuts.

Below is the code.

XAML

<UserControl x:Class="HSCGym.UserControls.CustomErrorControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"            
mc:Ignorable="d" d:DesignHeight="800" d:DesignWidth="1000">
    <Border x:Name="ErrorBorder" BorderBrush="Black" BorderThickness="2" CornerRadius="20" Background="White"
            Width="900" Height="700"
            VerticalAlignment="Stretch" HorizontalAlignment="Stretch"
            Grid.Row="0" Grid.RowSpan="2">
        <Border.Effect>
            <DropShadowEffect BlurRadius="7" Direction="300" ShadowDepth="6" Color="Black" />
        </Border.Effect>

        <Grid x:Name="LayoutRoot" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent" >
            <Grid.RowDefinitions>
            <RowDefinition Height="55" />
            <RowDefinition Height="55" />
            <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <TextBlock Text="{Binding ErrorText}" HorizontalAlignment="Center" FontSize="40" Grid.Row="0"/>
            <TextBlock Text="{Binding ErrorText2}" HorizontalAlignment="Center" FontSize="40" Grid.Row="1"/>

        <Button x:Name="btnExit" VerticalAlignment="Bottom" HorizontalAlignment="Left" Margin="38,0,0,20"
                    Content="Exit" Height="50" Width="200"  FontSize="20" Click="btnExit_Click"
                Grid.Row="2"/>
        </Grid>
    </Border>
</UserControl>

And the Code Behind:

public partial class CustomErrorControl
{
    public string ErrorText { get; set; }

    public string ErrorText2 { get; set; }

    public string StopText { get; set; }

    private readonly int x;
    private readonly int y;
    private readonly int r;

    public CustomErrorControl(int x, int y, int radius, string stopError)
    {
        InitializeComponent();

        this.x = x;
        this.y = y;
        r = radius;

        StopText = stopError;

        DrawOctagon(this.x, this.y, r);


    }
    public void DrawOctagon(int x, int y, int R)
    {
        int r2 = (int)(R/Math.Sqrt(2));

        // OuterOctagon
        Point[] outerOctagon = new Point[8];
        outerOctagon[0].X = x;
        outerOctagon[0].Y = y - R;

        outerOctagon[1].X = x + r2;
        outerOctagon[1].Y = y - r2;

        outerOctagon[2].X = x + R;
        outerOctagon[2].Y = y;

        outerOctagon[3].X = x + r2;
        outerOctagon[3].Y = y + r2;

        outerOctagon[4].X = x;
        outerOctagon[4].Y = y + R;

        outerOctagon[5].X = x - r2;
        outerOctagon[5].Y = y + r2;

        outerOctagon[6].X = x - R;
        outerOctagon[6].Y = y;

        outerOctagon[7].X = x - r2;
        outerOctagon[7].Y = y - r2;

        HexColor stop1Colour = new HexColor("#FFA30D0D");
        HexColor stop2Colour = new HexColor("#FFCA0C0C");
        HexColor stop3Colour = new HexColor("#FFF71212");

        GradientStop gs1 = new GradientStop { Color = stop1Colour, Offset = 0.98 };
        GradientStop gs2 = new GradientStop { Color = stop2Colour, Offset = 0.5 };
        GradientStop gs3 = new GradientStop { Color = stop3Colour, Offset = 0.04 };

        LinearGradientBrush gb = new LinearGradientBrush
                                     {
                                         StartPoint = new Point(0.77, 0.85),
                                         EndPoint = new Point(0.13, 0.15),
                                         GradientStops = new GradientStopCollection {gs1, gs2, gs3}
                                     };

        DropShadowEffect dse = new DropShadowEffect
                                   {
                                       BlurRadius = 8,
                                       Color = Colors.Black,
                                       Direction = 320,
                                       ShadowDepth = 10.0,
                                       Opacity = 0.5
                                   };

        Polygon octagonOuter = new Polygon
        {

            VerticalAlignment = VerticalAlignment.Center,
            HorizontalAlignment = HorizontalAlignment.Center,
            Fill = gb,

            Stroke = new SolidColorBrush(Colors.Black),
            StrokeThickness = 5,
            StrokeDashArray = new DoubleCollection { 10, 0 },
            Effect = dse,
            Points = new PointCollection
                        {
                            new Point(outerOctagon[0].X, outerOctagon[0].Y),
                            new Point(outerOctagon[1].X, outerOctagon[1].Y),
                            new Point(outerOctagon[2].X, outerOctagon[2].Y),
                            new Point(outerOctagon[3].X, outerOctagon[3].Y),
                            new Point(outerOctagon[4].X, outerOctagon[4].Y),
                            new Point(outerOctagon[5].X, outerOctagon[5].Y),
                            new Point(outerOctagon[6].X, outerOctagon[6].Y),
                            new Point(outerOctagon[7].X, outerOctagon[7].Y),
                        }
        };

        double outerOctCenterY = octagonOuter.Points[6].Y - octagonOuter.Points[2].Y;
        double outerOctCenterX = octagonOuter.Points[4].X - octagonOuter.Points[0].X;

        var rotate = new RotateTransform { Angle = 22.8, CenterX = outerOctCenterX, CenterY = outerOctCenterY };
        octagonOuter.RenderTransform = rotate;
        Grid.SetRow(octagonOuter, 2);

        TextBlock tbStopError = new TextBlock
                                    {
                                        Text = StopText,
                                        Foreground = new SolidColorBrush(Colors.White),
                                        FontFamily = new FontFamily("Courier New"),
                                        FontSize = 80,
                                        FontWeight = FontWeights.Bold,
                                        VerticalAlignment = VerticalAlignment.Center,
                                        HorizontalAlignment = HorizontalAlignment.Center
                                    };
        Grid.SetRow(tbStopError, 2);

        LayoutRoot.Children.Add(octagonOuter);
        LayoutRoot.Children.Add(tbStopError);   
    }

    private void btnExit_Click(object sender, RoutedEventArgs e)
    {
        MessageBox.Show("Clicked");
    }

}

Any ideas?

Many thanks

Neill

Update:

I have tested quickly putting MouseLeftButtonUp events on the grid and the border.

When I click the border, first the grid event fires, then the border event fires, but if I click the button, nothing fires. Does this mean the Button is above the grid and border so should be firing the event?

I will try some of the other suggestions as well in the meant time.

Neill

Update 2:

It gets stranger. I moved the button to the top and then click event fires. What I see is that from a certain Y point and below, absolutely no mouseleftbuttonup or click events fire, nada. This makes no sense. If I go from the bottom and click moving slowly up, then at a certain point, all events start firing.

Neill

Update 3

Hi all,

After removing controls one by one to see what is causing the issue, I now know it is the Border control. If I remove it, all works fine, when it is back, same problem as before. Any ideas?

Thanks

Neill

Update 4

Hi all,

OK so I finally sorted out the problem, so in case anybody finds themselves in a similar situation. It had nothing to do with that page at all. I am loading the page in a frame from a different page and what it seems is that I had to many row definitions set in the grid on the main page. After I corrected that, everything works fine.

Thanks

1

1 Answers

0
votes

First try fill button by Transparent color (00000000).

Also you can send solution or part of it to me and I shall try to help.