Auto Scrolling

[cargotruck]

I'm looking for a way to have a ScrollView containing a TreeView automatically scroll down or up when the user is using the arrow keys to move the cursor up or down the tree view. moves cursor leaves the visible area of a the window. In the code sample the user can move the cursor to objects on the tree that are our of the visual range, but must manually move the scroll bar in order to see the objects

        var scrolled_tree = new ScrollView(new Rect(5,5,175,75))
        {
            ContentSize = new Size(200,100), 
            ShowVerticalScrollIndicator = true,
            ShowHorizontalScrollIndicator = true
        };

        // create the directory tree object
        var tree = new TreeView()
        { 
            Width = 100, 
            Height = 100
        };

        tree.KeyDown += (e) =>
        {
            if(e.KeyEvent.Key == Key.CursorRight)
            {
                scrolled_tree.ContentSize = new Size(200,tree.ContentHeight);
            }
            if(e.KeyEvent.Key == Key.CursorLeft)
            {
                scrolled_tree.ContentSize = new Size(200,tree.ContentHeight);
            }
            if(e.KeyEvent.Key == Key.CursorDown)
            {
                tree.EnsureVisible((TreeNode)tree.SelectedObject);
                //scrolled_tree.ScrollDown(1);
            }
            if(e.KeyEvent.Key == Key.CursorUp)
            {
                scrolled_tree.ScrollUp(1);
            }
        };

       scrolled_tree.Add(tree);

[tznind]

The TreeView will automatically 'scroll' even without any ScrollBarView. But for this to work correctly the bounds of the control need to be set correctly. In your example the height of the tree is 100, this means that it will only adjust the visible portion of the tree when you scroll down 100 rows in the tree. It will assume that all 100 rows it's bounds are 'visible'. This is consistent with the other controls like TextView and ListView.

You can get a scroll bar to render by using the approach shown in TreeViewFileSystem.cs. The example scenario in CatalogUI uses ScrollBarView (not ScrollView).

https://github.com/migueldeicaza/gui.cs/blob/0dd0f2e5c4965e1ec430439605a2dab6ff6d2114/UICatalog/Scenarios/TreeViewFileSystem.cs#L89-L119

[cargotruck]

You're a champion. I removed the ScrollView and set the the Treeview()'s width and height to Dim.Fill(). Moving around the tree is much closer to what I want.

[sdsalyer]

A bit of a tangent, but I'm stuck trying to figure out how to get a ScrollBarView with a ListView to stay scrolled to the bottom. For example: a chat application where new messages would appear as the last entry on the bottom of the view without having to scroll. Any advice would be appreciated. :)

            #region console-view
            var consoleViewFrame = new FrameView("Console Log")
            {
                X = 0,
                Y = 0,
                Width = Dim.Percent(75),
                Height = Dim.Percent(80)
            };

            var consoleView = new ListView(this.consoleLog)
            {
                X = 0,
                Y = 0,
                Width = Dim.Fill(),
                Height = Dim.Fill(),
            };
            consoleViewFrame.Add(consoleView);

            var consoleScrollBarView = new ScrollBarView(consoleView, true);
            consoleScrollBarView.ChangedPosition += () => {
				consoleView.TopItem = consoleScrollBarView.Position;
				if (consoleView.TopItem != consoleScrollBarView.Position) {
					consoleScrollBarView.Position = consoleView.TopItem;
				}
				consoleView.SetNeedsDisplay ();
			};

			consoleView.DrawContent += (e) => {
				consoleScrollBarView.Size = consoleView.Source.Count - 1;
				consoleScrollBarView.Position = consoleView.TopItem;
				// consoleScrollBarView.OtherScrollBarView.Size = consoleView.Maxlength - 1;
				// consoleScrollBarView.OtherScrollBarView.Position = consoleView.LeftItem;
				consoleScrollBarView.Refresh ();
			};

            this.Add(consoleViewFrame);

            #endregion

[BDisp]

You can use the MoveEnd or the ScrollDown methods to go to the bottom of the ListView after a item is added.