0

So we wanted to have a custom keyboard on a winforms (it will run on a touch screen computer) so I quickly made one as a Custom UserControl so we can later re-use it if necessary. Here's how it looks now:

enter image description here

We'd also want it to scale if we'd have to resize it in the future. How can I make sure, when I resize my main UserControl (the keyboard itself, not any of the keys), the buttons sizes will all stay relative? So for example if I resized the keyboard to be 25% bigger (length & width), all my buttons would also have to resize that amount. So there'd have to be some empty space left between the buttons as you can see in the previous image.

Right now I've tried playing with the Anchor & Dock properties of the buttons and the UserControl, autosize and their size but I couldn't find the correct configuration that I wanted, unfortunately.

Does anyone know how I can resize my custom UserControl keyboard, while also relatively resizing my buttons inside it?

EDIT: So for example, if I increased the height of the entire UserControl by 100% (say 100px -> 200px), I'd want my 3 buttons "Tab", "Caps Lock" and "Shift" to now also fill those 200px in height, so "stretch" them for example. Same for width. So if I'd change the UserControl by 50% height & width, I'd want my buttons to change as well relatively to howmuch my UserControl has changed. So if width was changed +100%, I'd still want it filled horizontally with all my buttons. If only width/height is change it will stretch of course.

Tempuslight
  • 1,004
  • 2
  • 17
  • 34
  • so you want the keys to stay same size? why not just put them on a panel and then just move the panel the keys then dont actually move – BugFinder Feb 07 '18 at 10:21
  • You will need hook into the onresize events and probably need to calculate the layout manually. – TheGeneral Feb 07 '18 at 10:21
  • Does http://www.devcomponents.com/dotnetbar/TouchKeyboardControl.aspx or https://stackoverflow.com/questions/15554786/how-to-use-windows-on-screen-keyboard-in-c-sharp-winforms or https://stackoverflow.com/questions/26681498/use-custom-on-screen-keyboard-form-with-openfiledialog-and-savefiledialog help? – mjwills Feb 07 '18 at 10:22
  • 2
    Just use a [`TableLayoutPanel`](https://msdn.microsoft.com/en-us/library/system.windows.forms.tablelayoutpanel(v=vs.110).aspx) and use [`DockStyle.Fill`](https://msdn.microsoft.com/en-us/library/system.windows.forms.dockstyle(v=vs.110).aspx) to ensure it will fit into your control. IMO that's the easiest and best solutions. – mrogal.ski Feb 07 '18 at 10:25

2 Answers2

1

Source code for this thing would be helpful But without it:

Did you use row containers to keep controls in place automatically?

If yes, On control resize, size top docked row and bottom docked row to 1/3 of the total height And on row container resize, each control in the container should update its width according to its parent height

Strader
  • 111
  • 6
0

You probably have to implement this resize functionality manually, because Windows Forms is not really built to support this very well out of the box. Let's say the default size of the whole is W and H.

Now, when the app first loads, you can save the default sizes of all buttons and their locations into a List:

public class DefaultButtonLayout
{
    public Button Control {get;set;}
    public int X {get;set;}
    public int Y {get;set;}
    public int Width {get;set;}
    public int Height {get;set;}
}

So on first load you will generate the list of defaults and then in the Resize event handler you will first calculate the factor of change of size of the keyboard like xFactor = newW * 1.0 / W and yFactor = newH * 1.0 / H and subsequentely go through the list and set the Control properties:

Control.Left = ( int )( default.X * xFactor );
Control.Top = ( int )( default.Y * yFactor );
Control.Width = ( int )( default.Width * xFactor );
Control.Height = ( int )( default.Height * yFactor );
Martin Zikmund
  • 38,440
  • 7
  • 70
  • 91