[SOLVED] White vertical scrollbar of DialogGUIScrollList UI element

[fatcargo]

I am trying to make a UI for my partmodule using DialogGUI and need to fit a long list of UI elements inside window.

Sorry to bug people but im paging @HebaruSan, @DMagic, @MOARdV, @malkuth and others. If anyone has some time please respond.

DialogGUIScrollList (and a mandatory DialogGUIContentSizer) are used for this.

When opening a window, scrollbar of right side of scroll view has white thumb and a white body. The scroll view content itself also appears to have default style (grayish box with round corners).

To me it appears that scroll view has no style defined, so some of its elements either revert to hard-coded fail-safe defaults or take values from builtin style (HighLogic.UISkin).

Is this a problem with my style ?

Here is what i used to set my UISkinDef.scrollView. Please note that some values may by wildly off - its on purpose, for testing only.
 

//note that i did not used static class to define/initialize variables and methods,
//because i've had NREs when trying to use styles from static class on slider UI elements

scrollViewStyleState.background = SolidColorFill(Color.yellow);
scrollViewStyleState.textColor = Color.red;

scrollViewStyle.fixedHeight = 1f;
scrollViewStyle.stretchWidth = true;
scrollViewStyle.stretchHeight = true;
scrollViewStyle.lineHeight = 20f;
scrollViewStyle.clipping = TextClipping.Clip;
scrollViewStyle.alignment = TextAnchor.MiddleCenter;
scrollViewStyle.richText = false;
scrollViewStyle.wordWrap = false;
scrollViewStyle.fontStyle = FontStyle.Normal;
scrollViewStyle.fontSize = 20;
scrollViewStyle.font = UISkinManager.defaultSkin.font;
scrollViewStyle.disabled = scrollViewStyleState;
scrollViewStyle.highlight = scrollViewStyleState;
scrollViewStyle.active = scrollViewStyleState;
scrollViewStyle.normal = scrollViewStyleState;
scrollViewStyle.fixedWidth = 20f;

//MultiOptionDialog is supplied with this
  new DialogGUIVerticalLayout(
    new DialogGUIScrollList(new Vector2(400f, 150f), new Vector2(350f, 140f), false, true,
      new DialogGUIVerticalLayout(
        new DialogGUIContentSizer(UnityEngine.UI.ContentSizeFitter.FitMode.Unconstrained, UnityEngine.UI.ContentSizeFitter.FitMode.PreferredSize, true),
          //UI elements such as labels, sliders, buttons etc
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test"),
          new DialogGUILabel("label test")
      )//vertical layout - scroll
    )//scroll list
  )// vertical layout - main

I don't know which of these is wrong, though i'm concerned that one-style-covers-all approach to using same styling structure for all types of UI elements may be too rough (for example what effect would text color have on scrollview ?)

 

Edited October 24, 2018 by fatcargo

[HebaruSan]

A screenshot might help us guess what's going on.

EDIT: I hope you don't mind if I paste the actual image in-thread for convenience:

Edited October 22, 2018 by HebaruSan

[fatcargo]

Ok here it is.

https://imgur.com/8UO8tda

Note white box on right side of scroll view.

Off-topic : this is for my animation partmodule, i'm trying to expand B9 pack with new components.

But the development is horribly slow due to real-life commitments.

Edited October 22, 2018 by fatcargo

[HebaruSan]

UISkinDef has some verticalScrollbar* properties. Maybe those will help:

https://kerbalspaceprogram.com/api/class_u_i_skin_def.html

[fatcargo]

Thanks for the idea ! I'm not really after the class members listing, but their VALUES. So i did some digging and found a dump-values-of-all-members-inside-class over on stackoverflow.

What i did was

-write that function

-assign a HighLogic.UISkin.scrollView to a public variable

-set a convenient breakpoint

-then compile/copy dll/run ksp

-run debugger, run into breakpoint

-in immediate window i called that function and got all values

This way i can dissect how that (working) UISkinDef class is setup so i can clone it and try to modify until it looks that way i want to (or until it breaks ). Though now when i look at values my SolidColorFill() may be not correct.

Here is some more code. This is what i use to create backgrounds/fills for various UI elements.
 

        public Sprite SolidColorFill(Color color)
        {
            Texture2D tex = new Texture2D(1, 1, TextureFormat.ARGB32, false);
            tex.SetPixel(1, 1, color);
            tex.Apply();
            return Sprite.Create(
                tex,
                new Rect(0, 0, tex.width, tex.height),
                new Vector2(0.5f, 0.5f),
                tex.width
            );
        }

As it can be seen, it is copy from github sources, two functions mushed into one.

And this is a dump from "HighLogic.UISkin.scrollView" (some editing done to make it more legible):
 

//Type: UIStyle
//Fields:
 System.String name = scrollview
 UIStyleState normal = UIStyleState
 UIStyleState active = UIStyleState
 UIStyleState highlight = UIStyleState
 UIStyleState disabled = UIStyleState
 UnityEngine.Font font =
 System.Int32 fontSize = 0
 UnityEngine.FontStyle fontStyle = Normal
 System.Boolean wordWrap = False
 System.Boolean richText = True
 UnityEngine.TextAnchor alignment = UpperLeft
 UnityEngine.TextClipping clipping = Clip
 System.Single lineHeight = 13
 System.Boolean stretchHeight = False
 System.Boolean stretchWidth = True
 System.Single fixedHeight = 0
 System.Single fixedWidth = 0


//Type: UIStyleState
//Fields:
UnityEngine.Sprite background = rect_round_down_dark_veryTransparent //(UnityEngine.Sprite)
UnityEngine.Color textColor = RGBA(0.000, 0.000, 0.000, 1.000)

The function used to dump data is from C# Variable description function . I have removed some of the "\r" carriage returns. Note that when this is used in immediate window, it will escape \n newlines before printing, so it won't be a newline-formatted printout, rather a unbroken string. But it still beats manually exploring all members and doing copy/paste into text editor.

        public static string DisplayObjectInfo(System.Object o)
        {
            StringBuilder sb = new StringBuilder();

            // Include the type of the object
            System.Type type = o.GetType();
            sb.Append("Type: " + type.Name);

            // Include information for each Field
            sb.Append('\n' + "Fields:");
            System.Reflection.FieldInfo[] fi = type.GetFields();
            if (fi.Length > 0)
            {
                foreach (FieldInfo f in fi)
                {
                    sb.Append('\n' + " " + f.ToString() + " = " + f.GetValue(o));
                }
            }
            else
                sb.Append('\n' + " None");

            // Include information for each Property
            sb.Append('\n'+ "Properties:");
            System.Reflection.PropertyInfo[] pi = type.GetProperties();
            if (pi.Length > 0)
            {
                foreach (PropertyInfo p in pi)
                {
                    sb.Append('\n' + " " + p.ToString() + " = " +
                              p.GetValue(o, null));
                }
            }
            else
                sb.Append('\n' + " None");

            return sb.ToString();
        }

 

Edited October 23, 2018 by fatcargo

[fatcargo]

Solved it !

My custom UISkinDef style was incomplete !

Here is what is needed to specifically customize scrollview. When i first started tinkering with styles, i ignored these fields since i already had slider-related fields, i never associated scrollbar stuff with scrollview. Thus the point of confusion.

            CAMSkin.verticalScrollbarUpButton = buttonStyle;
            CAMSkin.verticalScrollbarThumb = buttonStyle;
            CAMSkin.verticalScrollbarDownButton = buttonStyle;
            CAMSkin.verticalScrollbar = windowStyle;
            CAMSkin.horizontalScrollbarThumb = buttonStyle;
            CAMSkin.horizontalScrollbarRightButton = buttonStyle;
            CAMSkin.horizontalScrollbarLeftButton = buttonStyle;
            CAMSkin.horizontalScrollbar = windowStyle;

This raises an interesting issue : when creating a new style, not all fields are initialized to values from HighLogic.UISkin (and it should, as fallback/default) , which looks odd to me.