I have a window with that structure:
Then in the code behind of the window in the constructor I add the following code:
int numRow = 2;
int numColumn = 3;
for (int row = 0; row < numRow; row++)
{
var rd = new RowDefinition();
rd.Height = new GridLength(1.0, GridUnitType.Star);
grdMain.RowDefinitions.Add(rd);
}
for (int column = 0; column < numColumn; column++)
{
var cd = new ColumnDefinition();
cd.Width = new GridLength(1.0, GridUnitType.Star);
grdMain.ColumnDefinitions.Add(cd);
}
for (int row = 0; row < numRow; row++)
{
for (int column = 0; column < numColumn; column++)
{
//var borderImage = new Border();
//borderImage.BorderThickness = new Thickness(1);
//borderImage.BorderBrush = new SolidColorBrush(Colors.Red);
var finalImage = new Image();
BitmapImage logo = new BitmapImage();
logo.BeginInit();
logo.UriSource = new Uri("pack://application:,,,/EasyRun;component/Resources/Images/ITA.png");
logo.EndInit();
finalImage.Source = logo;
//borderImage.Child = finalImage;
Grid.SetRow(finalImage, row);
Grid.SetColumn(finalImage, column);
grdMain.Children.Add(finalImage);
}
by doing so I expect the window to resize rows and columns accordin to the size of the parent window. But what happens is that while the horizontal stretch works the vertical doesn't.
So in short what I'd like is the grid to stretch columns/rows according to its parent window size
Try using a dockpanel instead then a stack panel
<DockPanel Name="stpMain">
<Button DockPanel.Dock="Bottom" Content="AAA" Width="100" Click="Button_Click"></Button>
<Border BorderThickness="2" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="0" BorderBrush="Red">
<Grid Name="grdMain"></Grid>
</Border>
Related
I am trying to build a Revit plugin using WPF and I am trying to add controls to a window dynamically. However, these controls are not getting displayed in the window and there is no error. Any help would be appreciated. Thank you.
Xaml
<ScrollViewer Margin="0,190,-0.4,-1">
<StackPanel Name="TaskList" Height="auto" Width="auto">
</StackPanel>
</ScrollViewer>
c#
for (var i = 0; i < dt.Rows.Count; i++)
{
Canvas canvas = new Canvas();
canvas.Height = 100;
canvas.Width = 300;
canvas.Background = new SolidColorBrush(Colors.Black);
canvas.Margin = new Thickness(20);
System.Windows.Controls.TextBox tb = new System.Windows.Controls.TextBox();
tb.Background = new SolidColorBrush(Colors.Black);
tb.Foreground = new SolidColorBrush(Colors.White);
tb.Width = 300;
tb.FontSize = 30;
tb.Height = 100;
tb.TextWrapping = TextWrapping.Wrap;
tb.MaxLength = 40;
tb.Text = dt.Rows[i][2].ToString();
canvas.Children.Add(tb);
TaskList.Children.Add(canvas);
TaskList.UpdateLayout();
}
EDIT
I am using a page tag as the base not window. Maybe that changes how i should approach the problem?
Remove Canvas entirely. You can add the TextBox elements to the StackPanel (TaskList) directly. If you want a border or spacing then you should use the Border control, not Canvas.
Additionally, only call UpdateLayout() after you've added all the controls to it:
using System.Windows.Controls;
...
for (var i = 0; i < dt.Rows.Count; i++)
{
TextBox tb = new TextBox();
tb.Background = new SolidColorBrush( Colors.Black );
tb.Foreground = new SolidColorBrush( Colors.White );
tb.Width = 300;
tb.FontSize = 30;
tb.Height = 100;
tb.TextWrapping = TextWrapping.Wrap;
tb.MaxLength = 40;
tb.Text = dt.Rows[i][2].ToString();
this.TaskList.Children.Add( tb );
}
this.TaskList.UpdateLayout();
Consider using an ItemsControl, instead of creating UI elements in code behind:
<ScrollViewer>
<ItemsControl x:Name="TaskList">
<ItemsControl.ItemTemplate>
<DataTemplate>
<TextBlock Width="300" Height="100" FontSize="30"
TextWrapping="Wrap" Text="{Binding}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</ScrollViewer>
Then just add strings to its Items property:
for (var i = 0; i < dt.Rows.Count; i++)
{
TaskList.Items.Add(dt.Rows[i][2].ToString());
}
I am dynamically generating a grid and am filling it with content through C# code. The code is as follows:
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="WPapp.Views.Home"
x:Name="HomeHeader">
<ContentPage.ToolbarItems>
<ToolbarItem Text="Refresh"
x:Name="refreshButton"
Clicked="refreshButton_Clicked"/>
</ContentPage.ToolbarItems>
<ContentPage.Content>
<ScrollView>
<StackLayout Margin="10"
HorizontalOptions="Center"
VerticalOptions="FillAndExpand"
x:Name="HomeContainer"
CompressedLayout.IsHeadless="true">
<Label Text="Featured Posts"
FontSize="Title"
FontAttributes="Bold"
Margin="0, 20, 10, 0"/>
<StackLayout x:Name="FeaturedContainer"
CompressedLayout.IsHeadless="true">
</StackLayout>
</StackLayout>
</ScrollView>
</ContentPage.Content>
</ContentPage>
int columnNum = 0;
int rowNum = 0;
foreach (var category in categoryList)
{
Grid postGrid = new Grid();
var column = new ColumnDefinition();
column.Width = new GridLength(5, GridUnitType.Star);
postGrid.ColumnDefinitions.Add(column);
postGrid.ColumnDefinitions.Add(column);
double division = featuredPosts.Count / 2;
double rowCount = Math.Ceiling(division);
for (int i = 0; i < rowCount; i++)
{
var row = new RowDefinition();
row.Height = GridLength.Auto;
postGrid.RowDefinitions.Add(row);
}
foreach (var item in featuredPosts)
{
Frame featuredFrame = new Frame();
featuredFrame.BorderColor = Color.Gray;
featuredFrame.CornerRadius = 5;
featuredFrame.Padding = 20;
Label postTitle = new Label();
postTitle.FontSize = Device.GetNamedSize(NamedSize.Subtitle, typeof(Label));
postTitle.FontAttributes = FontAttributes.Bold;
BoxView titleSeparator = new BoxView();
titleSeparator.Color = Color.Gray;
titleSeparator.HeightRequest = 1;
titleSeparator.HorizontalOptions = LayoutOptions.Fill;
Image postFeaturedImage = new Image();
postFeaturedImage.Aspect = Aspect.AspectFill;
BoxView imageSeparator = new BoxView();
imageSeparator.Color = Color.Gray;
imageSeparator.HeightRequest = 2;
imageSeparator.HorizontalOptions = LayoutOptions.Fill;
Label publishDate = new Label();
publishDate.FontSize = Device.GetNamedSize(NamedSize.Caption, typeof(Label));
StackLayout postDetails = new StackLayout();
postDetails.Children.Add(postTitle);
postDetails.Children.Add(titleSeparator);
postDetails.Children.Add(postFeaturedImage);
postDetails.Children.Add(imageSeparator);
postDetails.Children.Add(publishDate);
featuredFrame.Content = postDetails;
if ((featuredPosts.First() == item) && !(featuredPosts.Count() % 2 == 0))
{
postGrid.Children.Add(featuredFrame, columnNum, rowNum);
Grid.SetColumnSpan(featuredFrame, 2);
columnNum++;
}
else
{
postGrid.Children.Add(featuredFrame, columnNum, rowNum);
Grid.SetColumnSpan(featuredFrame, 1);
}
columnNum++;
if (columnNum == 2)
{
rowNum++;
columnNum = 0;
}
}
FeaturedContainer.Children.Add(postGrid);
columnNum = 0;
rowNum = 0;
}
With this code, this is the result I am getting:
As you can see, the top-left grid height is sized correctly as it is just big enough to fit its children. This is how it should be.
However, the problem is, sometimes the grid cell becomes too big, this is shown in the bottom-left and bottom-right cells. It is too tall! This is only for some of the cells.
What am I doing wrong and how can I fix this so the grid height is just big enough, not too big.
Here is my code:
Grid gameboard = new Grid();
gameboard.HorizontalAlignment = HorizontalAlignment.Left;
gameboard.VerticalAlignment = VerticalAlignment.Top;
gameboard.Width = Window.Current.Bounds.Width;
gameboard.Height = Window.Current.Bounds.Width;
Border border = new Border();
border.BorderThickness = new Thickness(1);
border.BorderBrush = new SolidColorBrush(Colors.Blue);
for (int j=0;j<7;j++)
{
gameboard.ColumnDefinitions.Add(new ColumnDefinition());
}
for (int i = 0; i < 7; i++)
{
gameboard.RowDefinitions.Add(new RowDefinition());
}
I am a learner, now i want to show my grid lines, can someone help me?
thanks a lot!
Since you are learning, I will help kick start your efforts with something to get you and others in a similar situation to the next step.
Start with code like the following, and tweak it, learn it, research it, and most of all have fun.
XAML
<Grid Name="LayoutRoot" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Margin="30" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
</Grid>
CODE
public MainPage()
{
this.InitializeComponent();
DataContext = this;
Loaded += MainPage_Loaded;
}
private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
Grid gameboard = new Grid();
gameboard.HorizontalAlignment = HorizontalAlignment.Stretch;
gameboard.VerticalAlignment = VerticalAlignment.Stretch;
for (int j = 0; j < 7; j++)
{
var cd = new ColumnDefinition();
cd.Width = new GridLength(1, GridUnitType.Star);
var rd = new RowDefinition();
rd.Height = new GridLength(1, GridUnitType.Star);
gameboard.ColumnDefinitions.Add(cd);
gameboard.RowDefinitions.Add(rd);
}
for (int j = 0; j < 7; j++)
{
for (int i = 0; i < 7; i++)
{
Border border = new Border();
border.BorderThickness = new Thickness(1);
border.BorderBrush = new SolidColorBrush(Colors.Blue);
border.HorizontalAlignment = HorizontalAlignment.Stretch;
border.VerticalAlignment = VerticalAlignment.Stretch;
var tb = new TextBlock();
tb.Text = string.Format($"i={i}; j={j}");
tb.Margin = new Thickness(4);
Grid.SetColumn(border, j);
Grid.SetRow(border, i);
border.Child = tb;
gameboard.Children.Add(border);
}
}
LayoutRoot.Children.Add(gameboard);
}
RESULT
SUMMARY
It's a start. It's not perfect, and to get the inner borders to not be thicker than the edges will take a small amount of effort, but should not be too difficult. Hint: think about how to use border.BorderThickness = new Thickness(l, t, r, b); where l/t/r/b are 1 or 0 depending on i/j. I might even make this an interview question; could be a fun discussion.
You can use Grid.ShowGridLines Property and add grid lines.
gameboard.ShowGridLines = true;
Grid myGrid = new Grid();
myGrid.Width = 1000;
myGrid.Height = 1000;
myGrid.Visibility = Visibility.Visible;
for (int i = 0; i < 100; i++)
{
RowDefinition rd = new RowDefinition();
rd.Height = new GridLength(10);
ColumnDefinition cd = new ColumnDefinition();
cd.Width = new GridLength(10);
myGrid.RowDefinitions.Add(rd);
myGrid.ColumnDefinitions.Add(cd);
}
after I ran this code i don't see any change in the app.
Am i doing something wrong?
In XAML
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" x:Name="fatherGrid">
</Grid>
In C#
public MainPage()
{
this.InitializeComponent();
Grid myGrid = new Grid();
myGrid.Width = 1000;
myGrid.Height = 1000;
myGrid.Visibility = Visibility.Visible;
for (int i = 0; i < 10; i++)
{
RowDefinition rd = new RowDefinition();
//rd.Height = new GridLength(10);
ColumnDefinition cd = new ColumnDefinition();
//cd.Width = new GridLength(10);
myGrid.RowDefinitions.Add(rd);
myGrid.ColumnDefinitions.Add(cd);
TextBlock tb = new TextBlock();
tb.Text = "Hello";
Grid.SetRow(tb, i);
Grid.SetColumn(tb, i);
myGrid.Children.Add(tb);
}
this.fatherGrid.Children.Add(myGrid);
}
Result:
I have declared a grid in xaml-
<Grid Grid.Row="1" x:Name="RejectedPartsGrid" >
</Grid>
This grid is populated with small grids from code behind-
for (int i = 0; i < 3; i++)
{
ColumnDefinition cd = new ColumnDefinition();
RowDefinition rd = new RowDefinition();
RejectedPartsGrid.ColumnDefinitions.Add(cd);
RejectedPartsGrid.RowDefinitions.Add(rd);
}
for (int row = 0; row < 3; row++)
{
for (int column = 0; column < 3; column++)
{
Grid gridImages = new Grid();
gridImages.Background = Brushes.Pink;
Grid.SetColumn(gridImages, column);
Grid.SetRow(gridImages, row);
gridImages.Margin = new Thickness(10);
ImageBrush myBrush = new ImageBrush();
Image image = new Image();
image.Stretch = Stretch.Fill;
if (imageCount < ListRejectedCarPartNames.Count)
{
carPartName = ListRejectedCarPartNames.ElementAt(imageCount);
conn.Open();
if (carPartName.Trim() != String.Empty)
{
using (SqlCeCommand com = new SqlCeCommand("SELECT CarImage FROM CarPartsImageMapping where CarPart = '" + carPartName + "'", conn))
{
SqlCeDataReader reader = com.ExecuteReader();
while (reader.Read())
{
carImagePath = reader.GetString(0);
}
}
image.Source = new BitmapImage(new Uri( System.Environment.CurrentDirectory + "\\" + carImagePath, UriKind.Relative));
myBrush.ImageSource = image.Source;
gridImages.Background = myBrush;
}
conn.Close();
}
RejectedPartsGrid.Children.Add(gridImages);
imageCount++;
}
I am using kinect,when i swipe left image in the small grids loads,but the problem is initially when the window loads,the size of the small grids inside main grid is big enough,but after the swipe action when the image loads in the small grids the size of the grid reduces,on second swipe it reduces more.. – I want the gridImages grid to be static all the time,how to do this?