Resizing a Control and Reclaiming Dead Space

So, what do you do when you have a lot of wasted real-estate and users complaining?

You can call Lawson and get a modification – paying a premium and dealing with all those nasty issues associated with modifications or use some jscript magic 🙂

The situation we had was with the ListView in MMS121, it was very small and there was a large amount of wasted space below it. Something that was causing a little bit of consternation.

Now if you have some WPF experience then you’d think that this would be a simple process – retrieve the ListView and set the Height, but sadly not.

The parent object of the ListView is a GridView (incidentally its parent is a ScrollView), this GridView is divided up in to Rows and Columns. The height of a control is limited by the total height of the rows that the control spans.

By default the ListView spans 7 rows, it will expand proportionally as you expand the window.

And to complicate things a little further when you resize the window some of the settings you apply to the ListView disappear.

So, we need to increase the rows we span, set the height to Nan (so it resizes with the Grid) and set the Height to ‘Stretch’ and then update these settings each time the Grid is resized.

The finished result looks like this.

And the code itself…

 

// Name: MMS121
// Version: 1.00 2010-12-13
// Description: Resizes the ListView so it uses all of the 
//  windows real-estate
//
// Revision History:
//	1.00	2010-12-13	* Completed

import System;
import System.Windows;
import System.Windows.Controls;
import MForms;

package MForms.JScript
{
   class MMS121
   {
   		var gController;
   		var gDebug;
   		var grdLVParent : Grid;
   		var glvListView : ListView;

       public function Init(element: Object, args: Object, controller : Object, debug : Object)
       {
      		gController = controller;
      		gDebug = debug;

			var content : Object = controller.RenderEngine.Content;
			
			var lcListControl : ListControl = controller.RenderEngine.ListControl;
			glvListView  = lcListControl.ListView;
			 
			grdLVParent = glvListView.Parent;
			
			LVResize();
			 
			grdLVParent.add_SizeChanged(OnGridSizeChanged);
			grdLVParent.add_Unloaded(OnGridUnloaded);
		}

		public function LVResize()
		{
			// we want to get a count of the rows so we can span them all
			var rdfRowDefinitionCollection : RowDefinitionCollection = grdLVParent.RowDefinitions;
			var iRowCount = rdfRowDefinitionCollection.Count;
			// make sure taht the margin is set to 0
			var mgMargin : Thickness = new Thickness(0);
			glvListView.Margin = mgMargin;

			// set the listview so it spans all of the columns
			Grid.SetRowSpan(glvListView, iRowCount);
			// set the Height so it is the same height as the Grid (NaN)
			glvListView.Height = grdLVParent.Height;
			// set a minimum height, this gets around an issue where if the window
			// becomes very small we don't seem to work properly (unless LVResize is
			// manually fired AFTER the window has resized)
			glvListView.MinHeight = 310;

			// and the key, make sure that we are stretching the control
			glvListView.VerticalAlignment = VerticalAlignment.Stretch;
		}

		public function OnGridSizeChanged(sender : Object, e : SizeChangedEventArgs)
		{
			LVResize();
		}
		
		public function OnGridUnloaded(sender : Object, e : RoutedEventArgs)
		{
			grdLVParent.remove_Unloaded(OnGridUnloaded);
			grdLVParent.remove_SizeChanged(OnGridSizeChanged);
		}

   }
}

This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s