Dynamically set button width and height - c#

I am new to Windows app developemnt:
I have a scenario where i need to display matrix of button with text below that, i am able to do that but the issue here is the matrix can be of any thing 2x2,2x3,2x4 or 2x6.
but the button should be square and not rectangle, if i add image to it then the image looks stretched.
here is my code :
public partial class MainPage : PhoneApplicationPage
{
int numberOfColumns = 2;
int numberOfRows = 3;
public double cellWidth;
public double cellHeight;
// Constructor
public MainPage()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(SetGridCellWidthAndHeight);
}
void SetGridCellWidthAndHeight(object sender, RoutedEventArgs e)
{
cellWidth = GridWindows.ActualHeight / numberOfColumns;
cellHeight = GridWindows.ActualHeight / numberOfRows;
this.GridWindows.Children.Add(SetUpGridLayout());
}
private Grid SetUpGridLayout()
{
Grid grid = new Grid();
grid.Background = new SolidColorBrush(Colors.White);
// Create column and row definitions.
ColumnDefinition[] columnDefinition = new ColumnDefinition[numberOfColumns];
RowDefinition[] rowDefinition = new RowDefinition [numberOfRows];
for (int i = 0; i < columnDefinition.Count(); i++)
{
columnDefinition[i] = new ColumnDefinition();
grid.ColumnDefinitions.Add(columnDefinition[i]);
}
for (int i = 0; i < rowDefinition.Count(); i++)
{
rowDefinition[i] = new RowDefinition();
grid.RowDefinitions.Add(rowDefinition[i]);
}
int count = 1;
for (int row = 0; row < numberOfRows; row++)
{
for (int column = 0; column < numberOfColumns; column++)
{
StackPanel gridViewStackPlanel = new StackPanel();
gridViewStackPlanel.Background = new SolidColorBrush(Colors.White);
Button button = new Button();
button.Width = cellWidth*0.8;
button.Height = cellHeight *0.8;
//topicButton.Background = new SolidColorBrush(Colors.Red);
button.VerticalAlignment = VerticalAlignment.Center;
button.HorizontalAlignment = HorizontalAlignment.Center;
button.Background = new SolidColorBrush(Colors.Red);
//To display the Topic name
TextBlock name= new TextBlock();
name.Text = " Value" + count;
name.Foreground = new SolidColorBrush(Colors.Black);
name.HorizontalAlignment = HorizontalAlignment.Center;
gridViewStackPlanel.Children.Add(button);
gridViewStackPlanel.Children.Add(name);
count++;
grid.Children.Add(gridViewStackPlanel);
Grid.SetColumn(gridViewStackPlanel, column);
Grid.SetRow(gridViewStackPlanel, row);
}
}
return grid;
}

When you write a code like this:
button.Width = cellWidth * 0.8;
button.Height = cellHeight * 0.8;
You would get a square only if cellWidth == cellHeight. And that is most likely not true. So your widths and heights are different. Consider replacing the above with something like this:
cellWidth = Math.Min(GridWindows.ActualHeight / numberOfColumns, GridWindows.ActualHeight / numberOfRows);
button.Width = cellWidth * 0.8;
button.Height = cellWidth * 0.8;
Now it will be square.

Related

Dynamically update button

I am attempting to dynamically add a list of buttons:
private void updateClientListUI()
{
if (this.InvokeRequired)
{
this.Invoke(new MethodInvoker(this.updateClientListUI));
}
else
{
int count = 1;
int x = 0;
int y = 0;
for (int i = 0; i < 5; i++)
{
Button btn = new Button();
btn.Text = count.ToString();
btn.Name = count.ToString();
btn.Size = new Size(35, 35);
btn.Location = new Point(150, 150 * y);
//btn.Dock = DockStyle.Fill;
y++;
count++;
Controls.Add(btn);
}
}
}
Unfortunately this does not apply any buttons to the form.
In addition I was wondering how could I append these buttons in a panel called subPanelClient
This worked for me, the issue was the position of the button, as you have to indicate it within a panel or form.
In this case i just docked them to the panel
private void updateClientListUI()
{
if (this.InvokeRequired)
{
this.Invoke(new MethodInvoker(this.updateClientListUI));
}
else
{
//Debug.WriteLine(clientNames[0]);
int basex = subPanelClient.Location.X;
int basey = subPanelClient.Location.Y;
subPanelClient.Controls.Clear();
Debug.WriteLine(clientNames.Count);
for (int i = 0; i < clientNames.Count; i++)
{
Button b = new Button();
b.Left = basex;
b.Top = basey;
b.Size = new Size(25, 25); // <== add this line
b.Dock = DockStyle.Top;
b.ForeColor = Color.Gainsboro;
b.FlatStyle = FlatStyle.Flat;
b.FlatAppearance.BorderSize = 0;
b.Padding = new Padding(35, 0, 0, 0);
b.TextAlign = ContentAlignment.MiddleLeft;
basey += 25;
b.Name = clientNames[i];
b.Text = clientNames[i];
subPanelClient.Controls.Add(b);
buttonsAdded.Insert(i, b);
}
}
}

How to set Size of colum and row of tablelayoutpanel in winform

I want to create a tablelayoutpanel use C#. This is my codes:
private void create_table()
{
table = new TableLayoutPanel();
table.Size = new Size(500, 500);
table.RowCount = rows; //10
table.ColumnCount = cols; //10
table.CellBorderStyle = TableLayoutPanelCellBorderStyle.Single;
this.table.Location = new System.Drawing.Point(10, 10);
TableLayoutRowStyleCollection rowStyles = this.table.RowStyles;
TableLayoutColumnStyleCollection colStyles = this.table.ColumnStyles;
foreach(RowStyle rowStyle in rowStyles)
{
rowStyle.SizeType = SizeType.Percent;
rowStyle.Height = 10;
}
foreach (ColumnStyle colStyle in colStyles)
{
colStyle.SizeType = SizeType.Percent;
colStyle.Width = 10;
}
this.Controls.Add(table);
}
But it doesn't work. Did I miss something?
enter image description here
Thanks.

How can I create a Grid in UWP that changes at runtime along with a 2D array?

I'm creating a boardgame app with UWP and C#. Currently my board is defined as a 2D array that grows as the tiles are placed. I'd like to be able to have a grid that grew with the array. I also wanted the empty spaces in the grid to be defined as buttons to be able to place the tile in the grid with a click.
I tried using this method in the backend code based on an answer I saw on this link but I don't think I'm doing things the right way.
public Grid GridGenerator(int rows, int cols, int[,] map)
{
Grid grid = new Grid();
grid.Margin = new Thickness(50, 50, 50, 50);
grid.Background = new SolidColorBrush(Windows.UI.Colors.Brown);
grid.HorizontalAlignment = HorizontalAlignment.Center;
grid.VerticalAlignment = VerticalAlignment.Center;
for (int i = 0; i < rows; i++)
{
RowDefinition Row = new RowDefinition();
Row.Height = new GridLength(0, GridUnitType.Auto);
grid.RowDefinitions.Add(Row);
for (int j = 0; j < cols; j++)
{
ColumnDefinition column = new ColumnDefinition();
column.Width = new GridLength(0, GridUnitType.Auto);
grid.ColumnDefinitions.Add(column);
if (map[i, j] == 0)
{
Button button = new Button();
button.MinHeight = 30;
button.MinWidth = 30;
button.Background = new SolidColorBrush(Windows.UI.Colors.AliceBlue);
button.Name = i.ToString() + j.ToString();
grid.Children.Add(button);
Grid.SetColumn(button, j);
}
else
{
TextBlock text = new TextBlock();
text.Text = map[i, j].ToString();
text.HorizontalTextAlignment = (TextAlignment)HorizontalAlignment.Center;
text.HorizontalAlignment = HorizontalAlignment.Center;
text.VerticalAlignment = VerticalAlignment.Center;
grid.Children.Add(text);
Grid.SetColumn(text, j);
}
}
}
It seems you are adding too many ColumnDefinitions through the nested loop. Try writing each step separately so that you can grasp what to do.
public Grid GridGenerator(int rows, int cols, int[,] map)
{
Grid grid = new Grid();
:
// 1.Prepare RowDefinitions
for (int i = 0; i < rows; i++)
{
RowDefinition Row = new RowDefinition();
Row.Height = new GridLength(0, GridUnitType.Auto);
grid.RowDefinitions.Add(Row);
}
// 2.Prepare ColumnDefinitions
for (int j = 0; j < cols; j++)
{
ColumnDefinition column = new ColumnDefinition();
column.Width = new GridLength(0, GridUnitType.Auto);
grid.ColumnDefinitions.Add(column);
}
// 3.Add each item and set row and column.
for (int i = 0; i < rows; i++)
{
for (int j = 0; j < cols; j++)
{
if (map[i, j] == 0)
{
Button button = new Button();
:
grid.Children.Add(button);
Grid.SetColumn(button, j);
Grid.SetRow(button, i); // Set row too!
}
:
}
}
return grid;
}
Appendix
How to display the grid generated in code behind:To display it, you need to put it in XAML tree. For example, if you'd like to show it in another Grid (named "LayoutRoot") in XAML page,
<Grid x:Name="LayoutRoot"></Grid>
add it to LayoutRoot.Children in the code behind.
Grid board_grid = GridGenerator(5, 5, map);
LayoutRoot.Children.Add(board_grid);

Add label to Panel programmatically

So I have a form, and I want to add some Panels with some controls(labels, and radiobuttons) when the form loads.
And I want to do it from the code, of course(it's for making an application with tests, and the questions will be random)
This is what I have done till now:
List<Panel>ls=new List<Panel>();
private void VizualizareTest_Load(object sender, EventArgs e)
{
for (int i = 0; i < 4; i++)
{
Panel pan = new Panel();
pan.Name = "panel" + i;
ls.Add(pan);
Label l = new Label();
l.Text = "l"+i;
pan.Controls.Add(l);
pan.Show();
}
}
But it doesn't show anything on the form.
Add the panel just created to the Form.Controls collection
private void VizualizareTest_Load(object sender, EventArgs e)
{
for (int i = 0; i < 4; i++)
{
Panel pan = new Panel();
pan.Name = "panel" + i;
ls.Add(pan);
Label l = new Label();
l.Text = "l"+i;
pan.Location = new Point(10, i * 100);
pan.Size = new Size(200, 90); // just an example
pan.Controls.Add(l);
this.Controls.Add(pan);
}
}
enter image description here
private void button2_Click(object sender, EventArgs e)
{
int X = 153;
int Y = 34;
for (int i = 1; i < 4; i++)
{
Panel pnl = new Panel();
pnl.SuspendLayout();
pnl.Location = new Point(X, Y);
pnl.Name = "pnl"+i;
pnl.Size = new Size(200, 57);
pnl.BorderStyle = BorderStyle.FixedSingle;
Label lbl = new Label();
lbl.Location = new Point(X - 100, Y - 17);
lbl.Name = "lbl" + i;
lbl.Size = new Size(75, 23);
lbl.Text = "lable_" +i;
pnl.Controls.Add(lbl);
pnl.ResumeLayout(false);
this.Controls.Add(pnl);
Y = Y + 95;
}
}
why not display label2 & label3?

How to remove textblock dynamically in wpf

public partial class Window2 : Window
{
int margin = 200;
public Window2()
{
this.InitializeComponent();
for (int i = 1; i <= 5; i++)
{
TextBlock DynamicLine = new TextBlock();
DynamicLine.Name = "lbl_DynamicLine" + i;
DynamicLine.Width = 600;
DynamicLine.Height = 20;
DynamicLine.Text =i+"Dynamic TextBlock";
DynamicLine.Margin = new Thickness(50, margin, 0, 0);
margin = margin + 20;
LayoutRoot.Children.Add(DynamicLine);
}
}
}
I tried to remove the textblock dynamically like below.
LayoutRoot.Children.Remove(DynamicLine);
But i can remove the last created textblock only with above code line.Now i want to remove all textblock dynamically. what should i do for that.
try this code
public partial class Window2 : Window
{
int margin = 200;
TextBlock DynamicLine;
public Window2()
{
this.InitializeComponent();
for (int i = 1; i <= 5; i++)
{
DynamicLine = new TextBlock();
DynamicLine.Name = "lbl_DynamicLine" + i;
RegisterName(DynamicLine.Name, DynamicLine);
DynamicLine.Width = 600;
DynamicLine.Height = 20;
DynamicLine.Text =i+"Dynamic TextBlock";
DynamicLine.Margin = new Thickness(50, margin, 0, 0);
margin = margin + 20;
LayoutRoot.Children.Add(DynamicLine);
}
for (int i = 1; i <= 5; i++)
{
DynamicLine = (TextBlock)this.FindName("lbl_DynamicLine" + i);
LayoutRoot.Children.Remove(DynamicLine);
}
}
}
To delete all children, you should call the clear method.
LayoutRoot.Children.Clear();
for (int i = LayoutRoot.Children.Count; i > 0; i--)
{
LayoutRoot.Children.RemoveAt(i-1);
}

Categories