How to Write a DependencyProperty for a TextBlock when it is a child element of a parent Button class in WPF C#?

Thanks for your comment my dear Sir, and this time your Code is pretty much insane and it's works flawlessly in my Project without any issue. And the result is as much as I expected.

But I want some more modifications in your code, by looking at your MultiplyConverter, the Value converter code, it seems like you just return the FontSize which is 10 in my case ( the 10 is a desired Size which I want in my XAML UI in this case) by multiplying with scaleValue and Believe me that's Code is freaking amazing and the beauty of the Code is how you implement and execute it in a very much simple realistic way. And really I love the concept that how you preserved the Font Size always at 10. This is one of the best Code I have ever seen on the whole Internet.

But there a little bit problem which is regarding the Converter Parameter, if you carefully see in your code then you definitely able to understand that you pass the Parameter 20, but unfortunately that has no effect on the sizing of the Text on the rendered output window because as our Main Goal is to preserve the Fix Font Size at 10 at any Scale Text size.

If I run your code then the only problem is the Text Block Size which is quite bigger, though it's always maintain the Font Size 10. I hope you given the Converter Parameter to Overcome the issue by increasing and decreasing it's value but if I play around the values then there no effect on the Text Block Size.

Is there any way to reduce the Text size without effecting Font Size 10?

@MERUN KUMAR MAITY, I have updated my code example, please check if it works for you now.

Thanks for your comment Sir, I already see the updated Code. And I properly understand your newly updated Converter classes (WidthToScaleConverter, HeightToScaleConverter).

But one part I never understand that How you use those WidthToScaleConverter and HeightToScaleConverter codes in the Main XAML?

Because if you carefully see your XAML Code then you definitely see that there no mention of this newly created Converter classes ? Have you forget to Update that?

Please kindly update and fix your Code where you use those newly created Converter classes.

@MERUN KUMAR MAITY , sry sir, I forget to update the XAML code and now I have updated the code.

Thanks for your comment, and this time your Code completely fails because as soon as I applied it on my Project the Text became so small even I am unable to see it. And the texts are so poorly rendered that cause eye allergy and the texts also became blurry.

And another important point is, you written the Binding format of the TextBlock in a wrong way. Though I restructure it and then apply it on my Project.

Here is the Correct Code of ScaleTransform :

 <TextBlock.LayoutTransform>
     <ScaleTransform ScaleX="{Binding ElementName=BtnHelp, Path=ActualWidth, Converter={StaticResource FontScaleWidth}}" 
                     ScaleY="{Binding ElementName=BtnHelp, Path=ActualHeight, Converter={StaticResource FontScaleHeight}}"                         
                     />
 </TextBlock.LayoutTransform>

You just missed the Path=ActualWidth/ActualHeight which I written in a correct way.

I think your previous Code :

 public class MultiplyConverter : IValueConverter
 {
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
     {
         double scaleValue = (double)value;
         return scaleValue * 10;
     }
     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
     {
         throw new NotImplementedException();
     }
 }

is more convenient. We have to find a way to resize the TextBlock by manipulating it's Height and Width through that Previous Converter Code.

Now it's up to you that how you implement that. One thing I want to tell you sir, I know that my Requirements are quite high and it's gives you a Lots of headache and pain to you, I really Love the effort you put in to solve my query.

Because that's the only way to solve this problem. You definitely feel proud by knowing that your Code can use on Medical Software which control MRI & CT Scan and other imaging devices used by Radiologists.

Thus, we have to put another amount of Hard work to solve this issue. You can trust me that once the issue is solved then I surely accepts your answer.

@MERUN KUMAR MAITY,

I think your thought are very good about , now I used the following code. You could check if it works for you. If it works well, I will update it in my answer.

XAML:

  <Button.Content>
      <TextBlock x:Name="myTextBlock"
             Text="Settings"
             HorizontalAlignment="Center"
             VerticalAlignment="Center"
             FontSize="10" Width="{Binding ElementName=btntest, Path=ActualWidth, Converter={StaticResource MultiplyConverter}}"
                 Height="{Binding ElementName=btntest, Path=ActualHeight, Converter={StaticResource MultiplyConverter}}" />
  </Button.Content>

Converter:

 public class MultiplyConverter : IValueConverter
 {
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
     {
         double scaleValue = (double)value;
         return scaleValue * 0.5;
     }
     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
     {
         throw new NotImplementedException();
     }
 }

Sample Tested:

Thanks for your comment. I am really amazed that you repeatedly give one by one solution, the solution is working or not that is totally different matter but believe me I Love and appreciate your hard work and effort you put in to solve my query.

Unfortunately your Code does not work this time also, it's give me same small, blurry and eye straining Text as Output which is very difficult to see and read.

Only your this Code works :

public class MultiplyConverter : IValueConverter
 {
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
     {
         double scaleValue = (double)value;
         return scaleValue * 10;
     }
     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
     {
         throw new NotImplementedException();
     }
 }

We need a different concept here as much as I hope. We should use your First Converter Code which I mention here, And we also need some another Code (don't know that a IValueConverter or not) to handle Height and Width of the Tex Block separately.

This problem really make you a ultimate pro Windows Developer because these are real Life Coding problems if you solve then your knowledge definitely outshine.

@MERUN KUMAR MAITY, you are welcome, could you please provide the latest code example(used my latest code example) with me? Because from my tested result, I did not see your behavior. Besides, you could provide your current picture to tell me where your problem is current. It seems that I can only understand your question partially. Therefore, it will better to provide more information with me so that I can know your problem clearly.

@MERUN KUMAR MAITY, after checking all the code you mentioned, I find that I modified Button's width and height, so my result is different from you.

This is my latest code example, please create a new wpf app to check if it works for you.

XAML:

<Window x:Class="WpfApp_ScaleX.MainWindow"
        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:local="clr-namespace:WpfApp_ScaleX"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800" Name="myMainWindow">
    <Window.Resources>
        <local:WidthConverter x:Key="WidthConverter"/>
        <local:TextBlockConverter x:Key="TextBlockConverter"/>
        <local:HeightConverter x:Key="HeightConverter"/>
    </Window.Resources>
    <Grid Name="MainGrid" SizeChanged="MainGrid_SizeChanged">
        <Grid.LayoutTransform>
            <ScaleTransform x:Name="ApplicationScaleTransform"
                        CenterX="0"
                        CenterY="0"
                        ScaleX="{Binding ElementName=myMainWindow, Path=ScaleValue}"
                        ScaleY="{Binding ElementName=myMainWindow, Path=ScaleValue}" />
        </Grid.LayoutTransform>
        <Grid VerticalAlignment="Center" HorizontalAlignment="Center" Height="150">
            <!--<TextBlock FontSize="20" Text="Hello World" Margin="5" VerticalAlignment="Top" HorizontalAlignment="Center"/>-->
            <Button VerticalAlignment="Center" HorizontalAlignment="Center" Height="24" Width="70" Name="myButton">
                <Button.LayoutTransform>
                    <ScaleTransform ScaleX="{Binding ElementName=myMainWindow, Path=ScaleValue}"
                               ScaleY="{Binding ElementName=myMainWindow, Path=ScaleValue}" />
                </Button.LayoutTransform>
                <!-- Embedding TextBlock via Button.Content -->
                <Button.Content>
                    <!-- Binding FontSize to ScaleValue with a multiplier -->
                    <TextBlock x:Name="myTextBlock"
                           Text="Settings"
                           HorizontalAlignment="Center"
                           VerticalAlignment="Center"
                            Width="{Binding ElementName=myButton, Path=ActualWidth, Converter={StaticResource TextBlockConverter}}"
                            Height="{Binding ElementName=myButton, Path=ActualHeight, Converter={StaticResource TextBlockConverter}}"
                           FontSize="10">
                        <TextBlock.LayoutTransform>
                            <!-- ScaleTransform will change the size of the TextBlock without affecting the font size -->
                            <ScaleTransform ScaleX="{Binding  ElementName=myButton,Path=ActualWidth, Converter={StaticResource WidthConverter}}" 
                                        ScaleY="{Binding ElementName=myButton, Path=ActualHeight, Converter={StaticResource HeightConverter}}"/>
                        </TextBlock.LayoutTransform>
                    </TextBlock>
                </Button.Content>
            </Button>
        </Grid>
    </Grid>
</Window>

I used 3 converter classes:

WidthConverter and HeightConverter are used to control the scale value of textblock.

TextBlockConverter is used to control size of textblock.

 public class WidthConverter : IValueConverter
 {
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
     {
         double scaleValue = (double)value;
         return scaleValue/180f;
     }
     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
     {
         throw new NotImplementedException();
     }
 }
 public class HeightConverter : IValueConverter
 {
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
     {
         double scaleValue = (double)value;
         return scaleValue / 60f;
     }
     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
     {
         throw new NotImplementedException();
     }
 }
 public class TextBlockConverter : IValueConverter
 {
     public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
     {
         double scaleValue = (double)value;
         return scaleValue * 0.9;
     }
     public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
     {
         throw new NotImplementedException();
     }
 }

Sample Tested Result: