如何以编程方式将两行内容和内容添加到Button [英] How to add Grid with two rows and a content to a Button programatically

问题描述

我在包含图像和文本的XAML中创建了按钮，我在该按钮的按钮中使用了Grid。
这是我的XAML代码：

 < Button x：Name =btnAddNewItem
表格。 Column =0Grid.Row =0
 FontSize =15
 BorderThickness =1.5
 Horizo​​ntalContentAlignment =Center
 VerticalContentAlignment =Center
 Foreground =White
 Background =White
 BorderBrush =＃0091EAMargin =5,0,0,0Height =90Width =90> 
< Button.Template> 
< ControlTemplate TargetType ={x：Type Button}> 
< Border BorderThickness ={TemplateBinding BorderThickness}
 BorderBrush ={TemplateBinding BorderBrush}
背景={TemplateBinding Background}> 
< ContentPresenter Horizo​​ntalAlignment ={TemplateBinding Horizo​​ntalContentAlignment}
 VerticalAlignment ={TemplateBinding VerticalContentAlignment}/> 
< / Border> 
< / ControlTemplate> 
< /Button.Template> 
<网格> 
< Grid.RowDefinitions> 
< RowDefinition Height =80 *> 
< RowDefinition Height =20 */> 
< /Grid.RowDefinitions> 
< Image Source =/ MyProject.Wpf; component / Icons / customer-icon.pngMargin =10Grid.Row =0Width =Auto/> 
< TextBlock Foreground =BlackMargin =0,0,0,3Grid.Row =1VerticalAlignment =CenterHorizo​​ntalAlignment =Center> Customer< / TextBlock> 
< / Grid> 
< / Button> 
  

以下是我的按钮的屏幕快照，以及我的应用运行时acctualy的外观：

正如你所看到的那样，

现在我试着做同样的外观按钮，但是从后面的代码，我实现了这一点（这里是图像）：

几乎是同一个按钮，但它缺少图像+文本应放置在网格中。

这是我的代码：

  Image imgControl = new Image（）; //我应该保留我的图标
 TextBlock text = new TextBlock（）; //放置在我的图标下方的文本
 
 imgControl.Source = new ImageSourceConverter（）。ConvertFromString（uriSource）as ImageSource; 
 text.Text =测试文本; 
 $ b $ string uriSource = new Uri（@C：\Projects\MyProject.Wpf\Icons\customer-icon.png，UriKind.Relative）.ToString（）; 
 
 SolidColorBrush mySolidColorBrush = new SolidColorBrush（）; 
 mySolidColorBrush =（SolidColorBrush）（new BrushConverter（）。ConvertFrom（＃0091EA））; 
 
 Button a = new Button（）; 
 
 a.BorderThickness = new Thickness（1）; 
 a.Background = Brushes.Transparent; 
 a.Foreground = new SolidColorBrush（Colors.Black）; 
 a.BorderBrush = mySolidColorBrush; 
 a.Width = 90; 
 a.Height = 90; 
 a.Style = Application.Current.Resources [MyButtonStyle] as Style; 
 
 Grid grid1 = new Grid（）; //我试图添加grid1两行，我应该放置图像和文本，[行0]图像，[行1]文本
 RowDefinition rowImage = new RowDefinition（）; //创建第一行
 RowDefinition rowTitle = new RowDefinition（）; //创建第二行
 
 rowImage.Height = new GridLength（8.0，GridUnitType.Star）; //图像占用80％的空间
 rowTitle.Height = new GridLength（2.0，GridUnitType.Star）; //文本占用空间的20％
 
 grid1.RowDefinitions.Add（rowImage）; //将图像添加到行
 grid1.RowDefinitions.Add（rowTitle）; //添加文本到行
 
 Grid.SetRow（imgControl，0）; 
 Grid.SetRow（text，1）; 
 
 a.Content = grid1; 
  

正如您所看到的，没有图像，即使它看起来也不放在我的按钮中就像我将它们添加到添加到我的按钮的网格中一样。

所以我想我在向按钮添加网格时做了一些错误。

感谢你们，
干杯

编辑爱德：

 switch（buttonPurpose）
 {
 case SettingsSubmenuItemEnum.Test：
 {
 button.HasIcon = true; 
 button.Icon = Controls.Enumerations.IconType.Other; 
 button.Click + = EH_testButton_Click; 
 button.IconAlignHorizo​​ntal = Horizo​​ntalAlignment.Left; 
 button.TextAlignHorizo​​ntal = Horizo​​ntalAlignment.Right; 
休息; 
} 
 
案例SettingsSubmenuItemEnum.Groups：
 {
 if（！OperatorController.HasOperatorAccess（currentOperator）
 return; 
 
 button.HasIcon = true; 
 button.Icon = Controls.Enumerations.IconType.Grupe; 
 button.Click + = EH_SubmenuButtonClickGrupePromet; 
 button.IconAlignHorizo​​ntal = Horizo​​ntalAlignment.Left; 
 button .TextAlignHorizo​​ntal = Horizo​​ntalAlignment.Right; 
 break; 
} 
 
 case SettingsSubmenuItemEnum.Cities：
 {
 if（！OperatorController.HasOperatorPristup（currentOperator）） 
 return; 
 
 button.HasIcon = true; 
 button.Icon = Controls.Enumerations.IconType.Other; 
 button.Click + = EH_MjestaClick; 
 button.IconAlignHorizo​​ntal = Horizo​​ntalAlignment.Left; 
 button.TextAlignHorizo​​ntal = Horizo​​ntalAlignment.Right; 
休息; 
} 
 
 spContentSubmenu.Children.Add（button）; 
 
 
 
 
 
 
 $ p 
在上面的代码中，我检查用户点击了哪个按钮并通过我向他展示相应的按钮..  
 
 
变量 buttonpurpose 是 SettingsSubmenuItemEnum  type 
解决方案
 
 
 
网格到一个按钮.. 
 
您需要将图像和TextBlock添加到网格的Children集合：
  ... 
 Grid.SetRow（imgControl，0）; 
 Grid.SetRow（text，1）; 
 
 // ADD：
 grid1.Children.Add（imgControl）; 
 grid1.Children.Add（text）; 
 
 a.Content = grid1; 
  
 
I created button in a XAML which contains image and text, I used Grid inside a button for that.
Here is my XAML code:
<Button x:Name="btnAddNewItem"
                    Grid.Column="0" Grid.Row="0"
                    FontSize="15"
                    BorderThickness="1.5"
                    HorizontalContentAlignment="Center"
                    VerticalContentAlignment="Center"
                    Foreground="White"
                    Background="White"
                    BorderBrush="#0091EA" Margin="5,0,0,0" Height="90" Width="90">
                    <Button.Template>
                        <ControlTemplate TargetType="{x:Type Button}">
                            <Border BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    Background="{TemplateBinding Background}">
                                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                  VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                            </Border>
                        </ControlTemplate>
                    </Button.Template>
        <Grid>
         <Grid.RowDefinitions>
            <RowDefinition Height="80*">
            <RowDefinition Height="20*"/>
        </Grid.RowDefinitions>
            <Image Source="/MyProject.Wpf;component/Icons/customer-icon.png" Margin="10" Grid.Row="0" Width="Auto"/>
            <TextBlock Foreground="Black" Margin="0,0,0,3" Grid.Row="1" VerticalAlignment="Center" HorizontalAlignment="Center" >Customer</TextBlock>
        </Grid>
                    </Button>
Here is screenshoot of my button, and how that acctualy looks when my app is runned:



As you can see guys, there are image and text inside of my button.

Now I'm trying to make same-look button but from code behind and I achieved this (here is image):



It's almost the same button but It's missing image+text which should be placed in Grid ..

Here is my code :
 Image imgControl = new Image(); // place where I should keep my icon
 TextBlock text = new TextBlock(); // place where should be text below my icon

 imgControl.Source = new ImageSourceConverter().ConvertFromString(uriSource) as ImageSource;
 text.Text = "Test text";

            string uriSource = new Uri(@"C:\Projects\MyProject.Wpf\Icons\customer-icon.png", UriKind.Relative).ToString();

            SolidColorBrush mySolidColorBrush = new SolidColorBrush();
            mySolidColorBrush = (SolidColorBrush)(new BrushConverter().ConvertFrom("#0091EA"));

            Button a = new Button();

            a.BorderThickness = new Thickness(1);
            a.Background = Brushes.Transparent;
            a.Foreground = new SolidColorBrush(Colors.Black);
            a.BorderBrush = mySolidColorBrush;
            a.Width  = 90;
            a.Height = 90;
            a.Style = Application.Current.Resources["MyButtonStyle"] as Style;

            Grid grid1=new Grid(); // I'm trying to add grid1 with two rows where I should place image and text, [row 0] for image, [row 1] for text
            RowDefinition rowImage = new RowDefinition(); //creating row one
            RowDefinition rowTitle = new RowDefinition(); //creating row two

            rowImage.Height = new GridLength(8.0, GridUnitType.Star); //Image will take 80% of space
            rowTitle.Height = new GridLength(2.0, GridUnitType.Star); //Text will take 20% of space

            grid1.RowDefinitions.Add(rowImage); //Adding image to row
            grid1.RowDefinitions.Add(rowTitle); //Adding text to row

            Grid.SetRow(imgControl, 0);
            Grid.SetRow(text, 1);

            a.Content = grid1;
As you can see, there is no image, neither text placed in my button, even if it looks like I added them to a grid which is added to my button.

So I guess I did something wrong with adding grid to a button..

Thanks guys,
Cheers

EDIT FOR Ed:
switch (buttonPurpose)
            {
                case SettingsSubmenuItemEnum.Test:
                    {
                        button.HasIcon = true;
                        button.Icon = Controls.Enumerations.IconType.Other;
                        button.Click += EH_testButton_Click;
                        button.IconAlignHorizontal = HorizontalAlignment.Left;
                        button.TextAlignHorizontal = HorizontalAlignment.Right;
                        break;
                    }

                case SettingsSubmenuItemEnum.Groups:
                    {
                        if (!OperatorController.HasOperatorAccess(currentOperator)
                            return;

                        button.HasIcon = true;
                        button.Icon = Controls.Enumerations.IconType.Grupe;
                        button.Click += EH_SubmenuButtonClickGrupePromet;
                        button.IconAlignHorizontal = HorizontalAlignment.Left;
                        button.TextAlignHorizontal = HorizontalAlignment.Right;
                        break;
                    }

                case SettingsSubmenuItemEnum.Cities:
                    {
                        if (!OperatorController.HasOperatorPristup(currentOperator))
                            return;

                        button.HasIcon = true;
                        button.Icon = Controls.Enumerations.IconType.Other;
                        button.Click += EH_MjestaClick;
                        button.IconAlignHorizontal = HorizontalAlignment.Left;
                        button.TextAlignHorizontal = HorizontalAlignment.Right;
                        break;
                    }

 spContentSubmenu.Children.Add(button);
}
}
In code above I'm checking which button user clicked and by that I'm showing to him corresponding buttons..

variable buttonpurpose is SettingsSubmenuItemEnum type
解决方案

  
So I guess I did something wrong with adding grid to a button..
You need to add the Image and the TextBlock to the Grid's Children collection:
...
Grid.SetRow(imgControl, 0);
Grid.SetRow(text, 1);

//ADD:
grid1.Children.Add(imgControl);
grid1.Children.Add(text);

a.Content = grid1;


                        
这篇关于如何以编程方式将两行内容和内容添加到Button的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！