Creating XAML grid rows programmatically - c#

I'm trying to generate a grid of data programmatically.
private void WorkPackageSearchButton_Click(object sender, RoutedEventArgs e)
{
EWP[] workPackages = SqlDataLayer.getSearchedWorkPackages(WorkPackageSearchBox.Text);
//declare variables
RowDefinition RowDef;
StackPanel StackP;
TextBlock TextB;
TextBlock TextC;
for (int i = 0; i < workPackages.Length; i++)
{
//Define new Row to add
RowDef = new RowDefinition();
RowDef.Height = new GridLength(30);
//Add row definition to Grid
WorkPackageResults.RowDefinitions.Add(RowDef);
//Define the control that will be added to new row
TextB = new TextBlock();
TextB.Text = workPackages[i].EWPStatus;
//TextB.Width = 75;
TextC = new TextBlock();
TextC.Text = workPackages[i].EWPCode;
//TextC.Width = 175;
//create stackpanel and define which row to add the stackpanel to
StackP = new StackPanel();
StackP.SetValue(Grid.RowProperty, i);
//add your control to the stackpanel
StackP.Children.Add(TextB);
StackP.Children.Add(TextC);
//add the stackpanel to the grid
WorkPackageResults.Children.Add(StackP);
}
}
The result is the data being added on top of each other:
How do I get each of the textblocks per iteration of the loop to be next to each other in a single row?

You have to set the Orientation of the StackPanel you're using to Horizontal
StackP = new StackPanel();
StackP.Orientation = Orientation.Horizontal;
the default Orientation of a StackPanel is Vertical, so it displays the items rows based.
Msdn Link and Examples

Related

How to display my images in a 4 by 4 grid using c#?

Currently my images just go down vertically, I want 4 images to display horizontally in each row, I've tried few suggestions on here but can't seem to get it working to work, its quite confusing to me as a beginner.
foreach (MyWCF.dogs c in lc)
{
RowDefinition row = new RowDefinition();
row.Height = new GridLength(1.0, GridUnitType.Auto);
g.RowDefinitions.Add(row);
StackPanel sp = new StackPanel();
sp.Orientation = Orientation.Horizontal;
BitmapImage image = new BitmapImage();
Image i1 = new Image();
using (InMemoryRandomAccessStream ms = new InMemoryRandomAccessStream())
{
using (DataWriter writer = new DataWriter(ms.GetOutputStreamAt(0)))
{
writer.WriteBytes((byte[])p.images);
writer.StoreAsync().GetResults();
}
//var image = new BitmapImage();
image.SetSource(ms);
}
i1.Source = image;
i1.Height = 100;
sp.Children.Add(i1);
Grid.SetRow(sp, gridRef);
g.Children.Add(sp);
gridRef++;
}
(Trying again with the Microsoft code explicitly included. I presume its OK to point to S.O. answers instead of copying an pasting the entirety of the S.O. answer here )
Perhaps the tutorial Grid Class : "Defines a flexible grid area that consists of columns and rows." will help. Then, this S.O. question Adding Image to Grid C# shows how to add images to a WPF grid.
Here is the material from the Grid Class post:
The following C# example demonstrates how to create a grid. In this case, the grid defines three ColumnDefinition elements and four RowDefinition elements that host child content.
// Create the application's main window
mainWindow = new Window();
mainWindow.Title = "Grid Sample";
// Create the Grid
Grid myGrid = new Grid();
myGrid.Width = 250;
myGrid.Height = 100;
myGrid.HorizontalAlignment = HorizontalAlignment.Left;
myGrid.VerticalAlignment = VerticalAlignment.Top;
myGrid.ShowGridLines = true;
// Define the Columns
ColumnDefinition colDef1 = new ColumnDefinition();
ColumnDefinition colDef2 = new ColumnDefinition();
ColumnDefinition colDef3 = new ColumnDefinition();
myGrid.ColumnDefinitions.Add(colDef1);
myGrid.ColumnDefinitions.Add(colDef2);
myGrid.ColumnDefinitions.Add(colDef3);
// Define the Rows
RowDefinition rowDef1 = new RowDefinition();
RowDefinition rowDef2 = new RowDefinition();
RowDefinition rowDef3 = new RowDefinition();
RowDefinition rowDef4 = new RowDefinition();
myGrid.RowDefinitions.Add(rowDef1);
myGrid.RowDefinitions.Add(rowDef2);
myGrid.RowDefinitions.Add(rowDef3);
myGrid.RowDefinitions.Add(rowDef4);
// Add the first text cell to the Grid
TextBlock txt1 = new TextBlock();
txt1.Text = "2005 Products Shipped";
txt1.FontSize = 20;
txt1.FontWeight = FontWeights.Bold;
Grid.SetColumnSpan(txt1, 3);
Grid.SetRow(txt1, 0);
// Add the second text cell to the Grid
TextBlock txt2 = new TextBlock();
txt2.Text = "Quarter 1";
txt2.FontSize = 12;
txt2.FontWeight = FontWeights.Bold;
Grid.SetRow(txt2, 1);
Grid.SetColumn(txt2, 0);
// Add the third text cell to the Grid
TextBlock txt3 = new TextBlock();
txt3.Text = "Quarter 2";
txt3.FontSize = 12;
txt3.FontWeight = FontWeights.Bold;
Grid.SetRow(txt3, 1);
Grid.SetColumn(txt3, 1);
// Add the fourth text cell to the Grid
TextBlock txt4 = new TextBlock();
txt4.Text = "Quarter 3";
txt4.FontSize = 12;
txt4.FontWeight = FontWeights.Bold;
Grid.SetRow(txt4, 1);
Grid.SetColumn(txt4, 2);
// Add the sixth text cell to the Grid
TextBlock txt5 = new TextBlock();
Double db1 = new Double();
db1 = 50000;
txt5.Text = db1.ToString();
Grid.SetRow(txt5, 2);
Grid.SetColumn(txt5, 0);
// Add the seventh text cell to the Grid
TextBlock txt6 = new TextBlock();
Double db2 = new Double();
db2 = 100000;
txt6.Text = db2.ToString();
Grid.SetRow(txt6, 2);
Grid.SetColumn(txt6, 1);
// Add the final text cell to the Grid
TextBlock txt7 = new TextBlock();
Double db3 = new Double();
db3 = 150000;
txt7.Text = db3.ToString();
Grid.SetRow(txt7, 2);
Grid.SetColumn(txt7, 2);
// Total all Data and Span Three Columns
TextBlock txt8 = new TextBlock();
txt8.FontSize = 16;
txt8.FontWeight = FontWeights.Bold;
txt8.Text = "Total Units: " + (db1 + db2 + db3).ToString();
Grid.SetRow(txt8, 3);
Grid.SetColumnSpan(txt8, 3);
// Add the TextBlock elements to the Grid Children collection
myGrid.Children.Add(txt1);
myGrid.Children.Add(txt2);
myGrid.Children.Add(txt3);
myGrid.Children.Add(txt4);
myGrid.Children.Add(txt5);
myGrid.Children.Add(txt6);
myGrid.Children.Add(txt7);
myGrid.Children.Add(txt8);
// Add the Grid as the Content of the Parent Window Object
mainWindow.Content = myGrid;
mainWindow.Show ();

C# - Adding new Textblocks to Grid RowDefinition programmatically

I am trying to make an application which reads out RSS feeds and shows them in an WPF form. To separate the posts I am using a grid and add 2 more RowDefinitions (one for the title and one for the subject).
Currently I am stuck. I want to add some Textblocks to the Rows that I just defined, but I have no idea how because they don't have names. Does anyone have an idea?
What I currently have:
//defining Grid
Grid post = new Grid();
post.HorizontalAlignment = HorizontalAlignment.Left;
post.VerticalAlignment = VerticalAlignment.Top;
post.Margin = new Thickness(10);
post.ShowGridLines = true;
post.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(500)
});
//loop trough all RSS feeds
foreach (SyndicationItem item in feed.Items)
{
//add rows for title and Summary
post.RowDefinitions.Add(new RowDefinition()
{
Height = new GridLength(50),
});
post.RowDefinitions.Add(new RowDefinition()
{
Height = new GridLength(50)
});
//Grid.SetRow(TitleTextblock, 0);
//Grid.SetRow(SummaryTextblock, 1);
//fills textblocks
post.Children.Add(new TextBlock()
{
Text = item.Title.Text
});
post.Children.Add(new TextBlock()
{
Text = item.Summary.Text
});
}
//show grid on window
this.Content = post;
which results in:
this
Allright, it looks like a problem with setting your Definitions correctly:
//defining Grid
Grid post = new Grid();
post.HorizontalAlignment = HorizontalAlignment.Left;
post.VerticalAlignment = VerticalAlignment.Top;
post.Margin = new Thickness(10);
post.ShowGridLines = true;
post.ColumnDefinitions.Add(new ColumnDefinition()
{
Width = new GridLength(500)
});
//add local field to keep track of what row you're on
int rowdeff = 0;
//loop trough all RSS feeds
foreach (SyndicationItem item in feed.Items)
{
//add rows for title and Summary
post.RowDefinitions.Add(new RowDefinition()
{
Height = new GridLength(50),
});
post.RowDefinitions.Add(new RowDefinition()
{
Height = new GridLength(50)
});
//create the textblocks
TextBlock TitleTextblock = new TextBlock;
TextBlock SummaryTextblock = new TextBlock;
//add content to textblocks
TitleTextBlock.Text = item.Title.Text;
SummaryTextblock.Text = item.Summary.Text;
//set definitions
Grid.SetColumn(TitleTextblock, 0);
Grid.SetColumn(SummaryTextblock, 1);
Grid.SetRow(TitleTextblock, rowdeff);
Grid.SetRow(SummaryTextblock, rowdeff);
//fills textblocks
post.Children.Add(TitleTextBlock);
post.Children.Add(SummaryTextblock);
//add next row
rowdeff++;
}
//show grid on window
this.Content = post;
You can try
TextBlock textBlock = new TextBlock();
Grid.SetRow(textBlock, 0);
Grid.SetColumn(textBlock, 0);
Hope this helps you

Accessing TextBlock in a grid with LINQ

I am dynamically generating rows in a XAML grid:
for (int i = 0; i < AssociatedSteps.Length; i++)
{
//if (i == 0 || AssociatedSteps[i].OriginPkg != AssociatedSteps[i-1].OriginPkg)
//{
//Define new Row to add
RowDef = new RowDefinition();
RowDef.Height = new GridLength(60);
//Add row definition to Grid
WorkPackageViewResults.RowDefinitions.Add(RowDef);
//Define the control that will be added to new row
Text1 = new TextBlock();
Text1.Text = AssociatedSteps[i].SF01;
Text1.Width = Settings.workPackageColumn5Width;
Text1.TextAlignment = TextAlignment.Center;
Text2 = new TextBlock();
Text2.Text = AssociatedSteps[i].SF10;
Text2.Width = Settings.workPackageColumn5Width;
Text2.TextAlignment = TextAlignment.Center;
Text3 = new TextBlock();
Text3.Text = AssociatedSteps[i].OriginPkg;
Text3.Width = Settings.workPackageColumn5Width;
Text3.TextAlignment = TextAlignment.Center;
Button1 = new Button();
Button1.Content = AssociatedSteps[i].Description;
Button1.Width = Settings.workPackageColumn5Width;
Button1.Click += new RoutedEventHandler(ProgressUpdateButton_Click);
Button1.Tag = AssociatedSteps[i].StepID;
//create stackpanel and define which row to add the stackpanel to
StackP = new StackPanel();
//StackP.Background = new SolidColorBrush(Colors.Wheat);
StackP.SetValue(Grid.RowProperty, i);
StackP.Orientation = Orientation.Horizontal;
StackP.Margin = new Thickness(0, 0, 0, 0);
PercentComplete = new TextBlock();
PercentComplete.Text = (Convert.ToDouble(AssociatedSteps[i].ToDateQty) / Convert.ToDouble(AssociatedSteps[i].MTOQty)).ToString();
PercentComplete.Width = Settings.workPackageColumn5Width;
PercentComplete.TextAlignment = TextAlignment.Center;
//add your control to the stackpanel
StackP.Children.Add(Text1);
StackP.Children.Add(Text2);
StackP.Children.Add(Text3);
StackP.Children.Add(Button1);
StackP.Children.Add(PercentComplete);
//add the stackpanel to the grid
WorkPackageViewResults.Children.Add(StackP);
}
I'm trying to use LINQ to get access to the grid being programatically updated above:
<Grid Name="WorkPackageViewResults">
</Grid>
I'm not seeing they type of options you would for a cell. I want to to access a particular rows PercentComplete TextBlock so I can update the text. How do I accomplish this?
Since there's only one StackPanel you could say e => e.GetType() == typeof(StackPanel). If you ever have many, then add a Name to the StackPanel and pull it by that.

Click event for programatically generated XAML buttons

I'm programatically generating a table where Text2 the columns are a button:
for (int i = 0; i < workPackages.Length; i++)
{
//Define new Row to add
RowDef = new RowDefinition();
RowDef.Height = new GridLength(60);
//Add row definition to Grid
WorkPackageResults.RowDefinitions.Add(RowDef);
//Define the control that will be added to new row
Text1 = new TextBlock();
Text1.Text = workPackages[i].EWPStatus;
Text1.Width = 100;
Text1.TextAlignment = TextAlignment.Center;
Text2 = new Button();
Text2.Content = workPackages[i].EWPCode;
Text2.Width = 300;
Text3 = new TextBlock();
Text3.Text = workPackages[i].Description;
Text3.Width = 500;
Text3.TextAlignment = TextAlignment.Center;
Text4 = new TextBlock();
Text4.Text = workPackages[i].ForeBadge;
Text4.Width = 100;
Text4.TextAlignment = TextAlignment.Center;
//create stackpanel and define which row to add the stackpanel to
StackP = new StackPanel();
StackP.SetValue(Grid.RowProperty, i);
StackP.Orientation = Orientation.Horizontal;
StackP.Margin = new Thickness(50, 0, 0, 0);
//add your control to the stackpanel
StackP.Children.Add(Text1);
StackP.Children.Add(Text2);
StackP.Children.Add(Text3);
StackP.Children.Add(Text4);
//add the stackpanel to the grid
WorkPackageResults.Children.Add(StackP);
}
How do I programatically add a click event? And when that click event is executed how do I know which button it came from?
Add an event handler to Text2.Click that will pass the sender as a parameter, that's how you know which one was clicked.

How to Remove the Last Row in Grid using WPF?

I have Two buttons in my Wpf UI named as Add,Remove. My requirement is, if i click add button it has to Add new row with two columns. If i click remove button, it has to remove the Last Inserted Row. I am using Grid for this.
I want to remove the Last Row from the Grid. I am able to add rows with 2 columns. I have the code for Remove. But it says some error. I donno how to remove the last inserted row entirely if i click Remove button. I have the following code.
public int count = 1;
private void btn_add_Click(object sender, RoutedEventArgs e)
{
//Creating Rows..
RowDefinition row0 = new RowDefinition();
row0.Height = new GridLength(30);
grid1.RowDefinitions.Add(row0);
//Creating columns..
ColumnDefinition col0 = new ColumnDefinition();
ColumnDefinition col1 = new ColumnDefinition();
ColumnDefinition col2 = new ColumnDefinition();
col0.Width = new GridLength(100);
col1.Width = new GridLength(100);
grid1.ColumnDefinitions.Add(col0);
grid1.ColumnDefinitions.Add(col1);
int i = count;
ComboBox cmb = new ComboBox();
cmb.Items.Add("add");
cmb.Items.Add("remove");
Grid.SetRow(cmb, i);
Grid.SetColumn(cmb, 0);
grid1.Children.Add(cmb);
TextBox txt = new TextBox();
Grid.SetRow(txt, i);
Grid.SetColumn(txt, 1);
grid1.Children.Add(txt);
count++;
}
private void btn_remove_Click(object sender, RoutedEventArgs e)
{
grid1.RowDefinitions.RemoveAt(count);
count--;
}
You normally don't need an additional counter for removing the last row, just use:
grid1.RowDefinitions.RemoveAt(grid1.RowDefinitions.Count - 1);

Categories

Resources