CODEWITHSUNDEEP
c#wpfuser-controlsgrid
Heintz
Heintz

Reputation: 21

How to let the User Control fit in the grid of a window?

i'm working on a project. And i have bump into some problems with WPF User Control.

I have added a User Control into the Window, and I want to put it at a specific grid. But User Control can not fit the gird, it is outside the Grid. It looks like this: User Control in Window

Here is the My User Control (TestGate)

<UserControl x:Class="MA.TestGate"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:MA"
         mc:Ignorable="d" Height="auto" Width="auto">
<Grid >

    <Canvas Name="GateCanvas" Width="Auto" Height="Auto" >
        <Rectangle Name="Base" Fill="White" Height="300" Canvas.Left="0" Stroke="Black" StrokeThickness="1" Canvas.Top="0" Width="300"/>
        <Polygon Name="Input_1" Points="0,25 86,75 0,125" Stroke="Black" Fill="White"></Polygon>
        <Polygon Name="Input_2" Points="0,175 86,225 0,275" Stroke="Black" Fill="White"></Polygon>
        <Polygon Name="Output" Points="275,125 275,175 300,175 300,125" Stroke="black" Fill="White"></Polygon>
    </Canvas>

</Grid>

User Control

And this is My Window

 <Window x:Class="MA.GATEWINDOW"
    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"
    xmlns:myControls ="wpf"
    xmlns:local="clr-namespace:MA"        
    mc:Ignorable="d"        
    Title="GATEWINDOW" Height="720" Width="1280" Name="TheAndGate">

<Grid ShowGridLines="True">
    <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition>
        </ColumnDefinition>
        <ColumnDefinition Width="1100"></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <Grid Grid.Row="0" Grid.Column="0" Name="Gate" ShowGridLines="True">
        <Grid.RowDefinitions>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
            <RowDefinition></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions></Grid.ColumnDefinitions>
        <local:TestGate Grid.Row="0" Grid.Column="0" ></local:TestGate>

The window is like this:enter image description here

I will be so grateful if anyone can help me solve this problem! Thanks!

Upvotes: 1

Views: 1322

Answers (2)

Heintz
Heintz

Reputation: 21

Well, thanks to @FelixCastor, the Problem has solved. The User Control should be rewrite like this

            <Viewbox Height="auto" Width="auto">
            <Canvas Height="300" Width=" 300">
                <Rectangle Name="Base" Fill="White" Height="300" Canvas.Left="0" Stroke="Black" StrokeThickness="1" Canvas.Top="0" Width="300"/>
                <Polygon Name="Input_1" Points="0,25 86,75 0,125" Stroke="Black" Fill="White"></Polygon>
                <Polygon Name="Input_2" Points="0,175 86,225 0,275" Stroke="Black" Fill="White"></Polygon>
                <Polygon Name="Output" Points="275,125 275,175 300,175 300,125" Stroke="black" Fill="White"></Polygon>
            </Canvas>
            </Viewbox>

And in the window we can also change a little bit like this:

        <Viewbox>
            <local:TestGate Grid.Row="0" Grid.Column="0"></local:TestGate>
        </Viewbox>

It looks like this: Result And problem solved.

Upvotes: 1

Siegfried.V
Siegfried.V

Reputation: 1595

As I didn't fully understand your problem, I don't give a solution(and I see others already tried to help as possible in comments), but I would advise you to make the code "easier" for future. These are just advises, as I used to do the same "mistakes" when I started with WPF, but it becomes easier to read with little changes :

<Grid.ColumnDefinitions></Grid.ColumnDefinitions>

is totally useless (empty)

<Grid.RowDefinitions>
   <RowDefinition></RowDefinition>
</Grid.RowDefinitions>

Almost useless as you have only one column(but in fact, you can leave it if you think you may expand it in future).

<RowDefinition></RowDefinition>

Can be rewritten <RowDefinition/>

Grid.Row="0" Grid.Column="0"

Unnecessary information, if ="0" this can be just removed

your code would become :

<Grid ShowGridLines="True">
    <Grid.RowDefinitions>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="1100"/>
    </Grid.ColumnDefinitions>
    <Grid Name="Gate" ShowGridLines="True">
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <local:TestGate Grid.Row="0" Grid.Column="0" ></local:TestGate>

Upvotes: 0

Related Questions