ListBox visuals like the default NT ListBox

[rafaelcoisa]

Hey guys,
I'm trying to make my ListBox look like the default NT ListBox.


(default NT ListBox)

I tried the code below but the result was this:



The result was very far from the NT default and also very ugly.

Is it possible to make my ListBox look like the default NT ListBox?
I'm just asking for the visuals.

[NinjaTrader_Gaby]

Hello rafaelcoisa,

Thank you for your post.

What specifically were you looking to change to make it look more similar? The ListBoxItems, header, etc. appear very similar.

I look forward to your response.

[rafaelcoisa]

NinjaTrader_Gaby

The way I made my ListBox was like the code below (I attached this code to my original post in a ".cs" file, but for some reason it is no longer appearing).

I would like my ListBox, such as NTListbox, to have the buttons "inside" the ListBox, and for the ScrollViewer controls to be on the right side of the GroupBox header, and the ScrollViewer itself to cross the ListBoxItems region and the Buttons region.

#region Using declarations
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Input;
using System.Windows.Media;
using System.Xml.Serialization;
using NinjaTrader.Cbi;
using NinjaTrader.Gui;
using NinjaTrader.Gui.Chart;
using NinjaTrader.Gui.SuperDom;
using NinjaTrader.Gui.Tools;
using NinjaTrader.Data;
using NinjaTrader.NinjaScript;
using NinjaTrader.Core.FloatingPoint;
using NinjaTrader.NinjaScript.DrawingTools;

using System.Windows.Controls;
#endregion

//This namespace holds Indicators in this folder and is required. Do not change it.
namespace NinjaTrader.NinjaScript.Indicators
{
    public class AlistTree : Indicator
    {
        #region equivalent XAML
//        <GroupBox Header="GroupBox">
//            <Border>
//                <Grid>
//                    <Grid.RowDefinitions>
//                        <RowDefinition/>
//                        <RowDefinition Height="Auto"/>
//                    </Grid.RowDefinitions>
                    
//                    <ScrollViewer>
//                        <ListBox Grid.Row="0" Height="100">
//                            <ListBoxItem Content="ListBoxItem0"/>
//                            <ListBoxItem Content="ListBoxItem1"/>
//                            <ListBoxItem Content="ListBoxItem2"/>
//                            <ListBoxItem Content="ListBoxItem3"/>
//                            <ListBoxItem Content="ListBoxItem4"/>
//                            <ListBoxItem Content="ListBoxItem5"/>
//                            <ListBoxItem Content="ListBoxItem6"/>
//                            <ListBoxItem Content="ListBoxItem7"/>
//                            <ListBoxItem Content="ListBoxItem8"/>
//                            <ListBoxItem Content="ListBoxItem9"/>
//                        </ListBox>
//                    </ScrollViewer>
                
//                    <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Right">
//                        <Button Content="aaa" Background="Transparent"/>
//                        <Button Content="aaa" Background="Transparent"/>
//                        <Button Content="aaa" Background="Transparent"/>
//                    </StackPanel>
//                    </Grid>
//            </Border>
//        </GroupBox>
        #endregion
        
        private Chart chartWindow;
        private int tabControlStartColumn;
        private Grid chartGrid;
        private Grid leftInnerGrid;
        
        
        private GroupBox     meGroupBox;
        private Border       meBorder;
        private Grid         meGrid;
        private ScrollViewer meScrollViewer;
        private ListBox      meListBox;
        private StackPanel   meStackPanel;
        private Button       meButton1;
        private Button       meButton2;
        private Button       meButton3;
        private Button       meButton4;
        
        protected override void OnStateChange()
        {
            if (State == State.SetDefaults)
            {
                Description                                    = @"";
                Name                                        = "AlistTree";
                Calculate                                    = Calculate.OnPriceChange;
                IsOverlay                                    = true;
                DisplayInDataBox                            = false;
                DrawOnPricePanel                            = false;
                DrawHorizontalGridLines                        = true;
                DrawVerticalGridLines                        = true;
                PaintPriceMarkers                            = false;
                ScaleJustification                            = NinjaTrader.Gui.Chart.ScaleJustification.Right;
                //Disable this property if your indicator requires custom values that cumulate with each new market data event.
                //See Help Guide for additional information.
                IsSuspendedWhileInactive                    = true;
            }
            else if (State == State.Historical)
            {
                if (ChartControl != null)
                {
                    ChartControl.Dispatcher.InvokeAsync(() =>
                    {
                        CreateWPFControls();
                    });
                }
            }
            else if (State == State.Terminated)
            {
                if (ChartControl != null)
                {
                    ChartControl.Dispatcher.InvokeAsync(() =>
                    {
                        DisposeWPFControls();
                    });
                }
            }
        }
        
        protected void CreateWPFControls()
        {
            #region needed
            chartWindow = Window.GetWindow(ChartControl.Parent) as Chart;
            
            if (chartWindow == null)
                return;
            
            chartGrid = chartWindow.MainTabControl.Parent as Grid;

            leftInnerGrid = new Grid() { Visibility = Visibility.Hidden };
            #endregion
            
            leftInnerGrid.RowDefinitions.Add(new RowDefinition());
            leftInnerGrid.RowDefinitions[0].Height = new GridLength(1, GridUnitType.Auto);
            
            leftInnerGrid.RowDefinitions.Add(new RowDefinition());
            leftInnerGrid.RowDefinitions[1].Height = new GridLength(1, GridUnitType.Star);
                        
            /// GroupBox
            meGroupBox = new GroupBox();
            meGroupBox.Header = "GroupBoxHeader";
            
            /// Border
            meBorder = new Border();
                        
            /// Grid
            meGrid = new Grid();
            meGrid.RowDefinitions.Add(new RowDefinition());
            meGrid.RowDefinitions[0].Height = new GridLength(1, GridUnitType.Star);
            meGrid.RowDefinitions.Add(new RowDefinition());
            meGrid.RowDefinitions[1].Height = new GridLength(1, GridUnitType.Auto);

            /// ScrollViewer
            meScrollViewer = new ScrollViewer();
            
            /// ListBox
            meListBox = new ListBox();
            meListBox.Height = 100;
            #region meListBox.Items.Add();
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 0" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 1" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 2" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 3" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 4" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 5" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 6" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 7" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 8" });
            meListBox.Items.Add(new ListBoxItem(){ Content = "ListBoxItem 9" });
            #endregion
            
            /// StackPanel
            meStackPanel = new StackPanel();
            meStackPanel.Orientation = Orientation.Horizontal;
            meStackPanel.HorizontalAlignment = HorizontalAlignment.Right;
            
            /// Button
            meButton1 = new Button();
            meButton1.Background = Brushes.Transparent;
            meButton1.Content = "btn1";
            
            meButton2 = new Button();
            meButton2.Background = Brushes.Transparent;
            meButton2.Content = "btn2";
            
            meButton3 = new Button();
            meButton3.Background = Brushes.Transparent;
            meButton3.Content = "btn3";
            
            meButton4 = new Button();
            meButton4.Background = Brushes.Transparent;
            meButton4.Content = "btn4";
            
            /// /// /// /// /// /// /// /// /// ///
            
            /// add ScrollViewer
            meScrollViewer.Content = meListBox;
            
            /// add StackPanel
            meStackPanel.Children.Add(meButton1);
            meStackPanel.Children.Add(meButton2);
            meStackPanel.Children.Add(meButton3);
            meStackPanel.Children.Add(meButton4);
            
            /// add Grid
            meGrid.Children.Add(meScrollViewer);
            meGrid.Children.Add(meStackPanel);
            Grid.SetRow(meStackPanel, 1);
            
            /// "add" Border
            meBorder.Child = meGrid;
            
            /// "add" GroupBox
            meGroupBox.Content = meBorder;
            
            
            /// --- put in window ---
            leftInnerGrid.Children.Add(meGroupBox);
            
            #region needed
            chartGrid.Children.Add(leftInnerGrid);
            
            tabControlStartColumn = Grid.GetColumn(chartWindow.MainTabControl);
            
            chartGrid.ColumnDefinitions.Insert(tabControlStartColumn, new ColumnDefinition() { Width = new GridLength(1, GridUnitType.Auto) });
            
            for (int i = 0; i < chartGrid.Children.Count; i++)
                if (Grid.GetColumn(chartGrid.Children[i]) >= tabControlStartColumn)
                    Grid.SetColumn(chartGrid.Children[i], Grid.GetColumn(chartGrid.Children[i]) + 1);

            Grid.SetColumn(leftInnerGrid, tabControlStartColumn);
            Grid.SetRow(leftInnerGrid, Grid.GetRow(chartWindow.MainTabControl));
            
            leftInnerGrid.Visibility    = Visibility.Visible;
            #endregion
        }
        
        private void DisposeWPFControls()
        {
            chartGrid.Children.Remove(leftInnerGrid);
        }
        
        protected override void OnBarUpdate() { }
    }
}

[rafaelcoisa]

A highlight:

[NinjaTrader_Gaby]

Hello rafaelcoisa,

Thank you for your response.

This is undocumented, however if we are able to find the correct resource name we will provide this.

Some small adjustments you can make would be setting myButton.BorderBrush = Brushes.Transparent and .FontStyle = FontStyles.Italic.

As for the scroll bar, you may be able to set the ScrollViewer in your XAML to <ScrollViewer VerticalScrollBarVisibility="Auto">

This is demonstrated in the xaml file of the AddOn Framework example (linked below):

https://ninjatrader.com/support/help...t_overview.htm