1

I wrote a custom control by WPF, and I wanna to do this:

1.Set the padding by percentage

2.Automatically set the top/left/right/bottom(Padding) all to the minimum one of top/left/right/bottom(Padding).


here is the code in Generic.xaml

  <Style TargetType="{x:Type local:SC}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:SC}">
                    <Grid Margin="{TemplateBinding Margin}" Background="{TemplateBinding Background}" >
                        <Grid Margin="{TemplateBinding Padding}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Bind something"></ColumnDefinition>
                                <ColumnDefinition Width="Bind something"></ColumnDefinition>
                                <ColumnDefinition Width="Bind something"></ColumnDefinition>
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Bind something"></RowDefinition>
                                <RowDefinition Height="Bind something"></RowDefinition>
                                <RowDefinition Height="Bind something"></RowDefinition>
                            </Grid.RowDefinitions>
                            <Grid Grid.Column="1" Grid.Row="1">
                                <ContentPresenter Content="{TemplateBinding Content}"></ContentPresenter>
                            </Grid>
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

My idea is to use 3 rows&3 columns, Set the GridLength each and make the content to Grid.Column="1"&Grid.Row="1" to do it.

But after I wrote some code, I found that I have to use a multibinding&Converter , calculate the GridLength repeatedly many times to do it. I think the results are the same so that the repeating calculations are no use. What's more, it will slow the performance while if there are many this control in the project.

I am afraid I did not explain clearly and make some misunderstand yet. But I want to learn how to achieve this. Thank you.

102425074
  • 781
  • 1
  • 7
  • 23
  • Have you tried using shared size columns/rows instead? – H.B. Mar 04 '19 at 12:43
  • Is your concern about _wasting performance_ simply because you don't like the CPU to do the same calculation multiple times even though it probably can do this in microseconds or do you have a visual issue with screen update frequency/framerate? – Martin Liversage Mar 04 '19 at 12:45
  • how can you have 3 rows which are half of their parents height each? 3*=0.5 = 150 % of the available space used.... – Denis Schaf Mar 04 '19 at 12:46
  • No, there is something different, I want the columns and rows length are the same as ActualHeight/2 but not just share the size.@H.B. – 102425074 Mar 04 '19 at 12:53
  • @MartinLiversage Firstly maybe as you said it only takes microseconds to do it. But the more this custom control I use in the project, the more time it will takes. What's more, I don't think I shoud coding like this. – 102425074 Mar 04 '19 at 12:55
  • @DenisSchaf I am sorry about that for writing one more and I will fix it. – 102425074 Mar 04 '19 at 12:56
  • it is bit confusing why you have been converting `ActualHeight` for both `Width` and `Height` fo a `Grid`. Can you please elaborate on what you are trying to achieve Visually? – Gopichandar Mar 04 '19 at 13:01
  • @Gopichandar What I do is something complex than this and I edit it to make everyone know the meaning easier. I wanna to make a custom control that can set the padding by percentage. As we know, the top/left/right/bottom(Padding) now will be different and I want to automatically set all equal to the minimum one. – 102425074 Mar 04 '19 at 13:14
  • @Gopichandar In conclusion:1.Set the padding by percentage 2.Automatically set the top/left/right/bottom(Padding) all to the minimum one of top/left/right/bottom(Padding). – 102425074 Mar 04 '19 at 13:17
  • i m afraid i dont quite understand what you are trying to achive... what kind of ratios do you want? – Denis Schaf Mar 04 '19 at 13:52
  • I want the padding like CSS can be set by percentage for the window will resize frequently and I want the padding can resize by percentage also. And also I wanna the pixel of top/left/right/bottom in Padding can automatically set to the same so that it will looks like better.@DenisSchaf – 102425074 Mar 04 '19 at 13:59

1 Answers1

1

The star attribute in columns or rows will make all sizes equal in this case this will result in 2 columns being half of the size.

You can also make one row 2 times as big as the other be giving one row the "*" and the second row 2 starts "2*".

In your case replace this:

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="{TemplateBinding ActualHeight,Converter={StaticResource GridLengthConverter}}"></ColumnDefinition>
    <ColumnDefinition Width="{TemplateBinding ActualHeight,Converter={StaticResource GridLengthConverter}}"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
    <RowDefinition Height="{TemplateBinding ActualHeight,Converter={StaticResource GridLengthConverter}}"></RowDefinition>
    <RowDefinition Height="{TemplateBinding ActualHeight,Converter={StaticResource GridLengthConverter}}"></RowDefinition>
</Grid.RowDefinitions>

with:

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="*"></ColumnDefinition>
    <ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>

Edit:

<Grid.RowDefinitions>
    <RowDefinition Height="4*"></RowDefinition>
    <!-- This will take 80 % of the space available-->
    <RowDefinition Height="*"></RowDefinition>
    <!-- This will take 20 % of the space available-->
</Grid.RowDefinitions>
marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
Denis Schaf
  • 2,478
  • 1
  • 8
  • 17
  • OK, thanks a lot. But I am curious about one thing: if the calculate is more complex(such as (ActualHeight+ActualWidth)/2) so that can not use the star. How can I solve this problem. Thank you. – 102425074 Mar 04 '19 at 13:04
  • whenever you want to use multible attributes for example relating a controls width to the height you will NEED a converter but for basic stuff like equally in size or a specific ratio you can use the star – Denis Schaf Mar 04 '19 at 13:08
  • OK, thanks. It seems I have no choice to make the complex one. – 102425074 Mar 04 '19 at 13:15
  • could you update your code to show your specific case? maybe there is a better way we can figure out together – Denis Schaf Mar 04 '19 at 13:20
  • I edited the topic and introduce it in more detail. I apologize for making some misunderstand. – 102425074 Mar 04 '19 at 13:40