Merge pull request #147 from peppy/options-fixes

Options: Fix paddings, transitions, const variable names.

osu-framework

@@ -1 +1 @@
-Subproject commit b8d0a0050be25aec4333134ca18497340e1154a7
+Subproject commit 25b8c3c6cfead49acf5659a750c7e604289d5b81

osu.Game/OsuGame.cs

@@ -35,6 +35,8 @@ namespace osu.Game
 
         string[] args;
 
+        public OptionsOverlay Options;
+
         public OsuGame(string[] args = null)
         {
             this.args = args;
@@ -89,6 +91,8 @@ namespace osu.Game
                 }
             });
 
+            (Options = new OptionsOverlay { Depth = float.MaxValue / 2 }).Preload(game, Add);
+
             (intro = new Intro
             {
                 Beatmap = Beatmap
@@ -127,6 +131,16 @@ namespace osu.Game
                     return true;
             }
 
+            if (state.Keyboard.ControlPressed)
+            {
+                switch (args.Key)
+                {
+                    case Key.O:
+                        Options.ToggleVisibility();
+                        return true;
+                }
+            }
+
             return base.OnKeyDown(state, args);
         }
 

osu.Game/OsuGameBase.cs

@@ -27,7 +27,6 @@ namespace osu.Game
 
         protected override string MainResourceFile => @"osu.Game.Resources.dll";
 
-        public OptionsOverlay Options;
         public APIAccess API;
 
         protected override Container<Drawable> Content => ratioContainer;
@@ -44,8 +43,7 @@ namespace osu.Game
 
             Children = new Drawable[]
             {
-                Options = new OptionsOverlay(),
-                Cursor = new OsuCursorContainer()
+                Cursor = new OsuCursorContainer { Depth = float.MaxValue }
             };
 
             Beatmap.ValueChanged += Beatmap_ValueChanged;

osu.Game/Overlays/Options/OptionsSection.cs

@@ -35,8 +35,8 @@ namespace osu.Game.Overlays.Options
                     Padding = new MarginPadding
                     {
                         Top = 10 + borderSize,
-                        Left = OptionsOverlay.SideMargins,
-                        Right = OptionsOverlay.SideMargins,
+                        Left = OptionsOverlay.CONTENT_MARGINS,
+                        Right = OptionsOverlay.CONTENT_MARGINS,
                         Bottom = 10,
                     },
                     RelativeSizeAxes = Axes.X,

osu.Game/Overlays/Options/OptionsSidebar.cs

@@ -9,47 +9,59 @@ using osu.Game.Graphics;
 
 namespace osu.Game.Overlays.Options
 {
-    public class OptionsSideNav : Container
+    public class OptionsSidebar : Container
     {
         private FlowContainer content;
         protected override Container<Drawable> Content => content;
 
-        public OptionsSideNav()
+        public OptionsSidebar()
         {
             RelativeSizeAxes = Axes.Y;
             InternalChildren = new Drawable[]
             {
-                content = new FlowContainer
-                {
-                    AutoSizeAxes = Axes.Y,
-                    RelativeSizeAxes = Axes.X,
-                    Origin = Anchor.CentreLeft,
-                    Anchor = Anchor.CentreLeft,
-                    Direction = FlowDirection.VerticalOnly
-                },
                 new Box
                 {
-                    Colour = new Color4(30, 30, 30, 255),
-                    RelativeSizeAxes = Axes.Y,
-                    Width = 2,
-                    Origin = Anchor.TopRight,
-                    Anchor = Anchor.TopRight,
-                }
+                    Colour = Color4.Black,
+                    RelativeSizeAxes = Axes.Both,
+                },
+                new SidebarScrollContainer
+                {
+                    Children = new []
+                    {
+                        content = new FlowContainer
+                        {
+                            Origin = Anchor.CentreLeft,
+                            Anchor = Anchor.CentreLeft,
+                            AutoSizeAxes = Axes.Y,
+                            RelativeSizeAxes = Axes.X,
+                            Direction = FlowDirection.VerticalOnly
+                        }
+                    }
+                },
             };
         }
 
+        private class SidebarScrollContainer : ScrollContainer
+        {
+            public SidebarScrollContainer()
+            {
+                Content.Anchor = Anchor.CentreLeft;
+                Content.Origin = Anchor.CentreLeft;
+            }
+        }
+
         public class SidebarButton : Container
         {
             private TextAwesome drawableIcon;
             private Box backgroundBox;
             public Action Action;
-            
+
             public FontAwesome Icon
             {
                 get { return drawableIcon.Icon; }
                 set { drawableIcon.Icon = value; }
             }
-            
+
             public SidebarButton()
             {
                 Size = new Vector2(60);
@@ -69,20 +81,20 @@ namespace osu.Game.Overlays.Options
                     },
                 };
             }
-            
-            protected override bool OnMouseDown(InputState state, MouseDownEventArgs e)
+
+            protected override bool OnClick(InputState state)
             {
                 Action?.Invoke();
                 backgroundBox.FlashColour(Color4.White, 400);
                 return true;
             }
-            
+
             protected override bool OnHover(InputState state)
             {
                 backgroundBox.FadeTo(0.4f, 200);
                 return true;
             }
-    
+
             protected override void OnHoverLost(InputState state)
             {
                 backgroundBox.FadeTo(0, 200);

osu.Game/Overlays/OptionsOverlay.cs

@@ -24,21 +24,17 @@ namespace osu.Game.Overlays
 {
     public class OptionsOverlay : OverlayContainer
     {
-        internal const float SideMargins = 10;
+        internal const float CONTENT_MARGINS = 10;
+
         private const float width = 400;
-        private const float sideNavWidth = 60;
-        private const float sideNavPadding = 0;
+        private const float sidebar_width = 60;
+        private const float sidebar_padding = 10;
 
         private ScrollContainer scrollContainer;
-        private FlowContainer flowContainer;
+        private OptionsSidebar sidebar;
 
         public OptionsOverlay()
         {
-            Depth = float.MaxValue;
-            RelativeSizeAxes = Axes.Y;
-            Size = new Vector2(width, 1);
-            Position = new Vector2(-width, 0);
-
             var sections = new OptionsSection[]
             {
                 new GeneralSection(),
@@ -52,20 +48,24 @@ namespace osu.Game.Overlays
                 new MaintenanceSection(),
             };
 
+            RelativeSizeAxes = Axes.Y;
+            AutoSizeAxes = Axes.X;
+
             Children = new Drawable[]
             {
                 new Box
                 {
                     RelativeSizeAxes = Axes.Both,
                     Colour = Color4.Black,
-                    Alpha = 0.8f,
+                    Alpha = 0.6f,
                 },
                 scrollContainer = new ScrollContainer
                 {
+                    ScrollbarOverlapsContent = false,
                     ScrollDraggerAnchor = Anchor.TopLeft,
                     RelativeSizeAxes = Axes.Y,
-                    Width = width - (sideNavWidth + sideNavPadding * 2),
-                    Position = new Vector2(sideNavWidth + sideNavPadding * 2, 0),
+                    Width = width,
+                    Padding = new MarginPadding { Left = sidebar_width },
                     Children = new[]
                     {
                         new FlowContainer
@@ -79,31 +79,31 @@ namespace osu.Game.Overlays
                                 {
                                     Text = "settings",
                                     TextSize = 40,
-                                    Margin = new MarginPadding { Left = SideMargins, Top = 30 },
+                                    Margin = new MarginPadding { Left = CONTENT_MARGINS, Top = 30 },
                                 },
                                 new SpriteText
                                 {
                                     Colour = new Color4(235, 117, 139, 255),
                                     Text = "Change the way osu! behaves",
                                     TextSize = 18,
-                                    Margin = new MarginPadding { Left = SideMargins, Bottom = 30 },
+                                    Margin = new MarginPadding { Left = CONTENT_MARGINS, Bottom = 30 },
                                 },
-                                flowContainer = new FlowContainer
+                                new FlowContainer
                                 {
                                     AutoSizeAxes = Axes.Y,
                                     RelativeSizeAxes = Axes.X,
                                     Direction = FlowDirection.VerticalOnly,
+                                    Children = sections,
                                 }
                             }
                         }
                     }
                 },
-                new OptionsSideNav
+                sidebar = new OptionsSidebar
                 {
-                    Padding = new MarginPadding { Left = sideNavPadding, Right = sideNavPadding },
-                    Width = sideNavWidth + sideNavPadding * 2,
+                    Width = sidebar_width,
                     Children = sections.Select(section =>
-                        new OptionsSideNav.SidebarButton
+                        new OptionsSidebar.SidebarButton
                         {
                             Icon = section.Icon,
                             Action = () => scrollContainer.ScrollIntoView(section)
@@ -111,7 +111,6 @@ namespace osu.Game.Overlays
                     )
                 }
             };
-            flowContainer.Add(sections);
         }
 
         protected override bool OnMouseDown(InputState state, MouseDownEventArgs args) => true;
@@ -130,13 +129,15 @@ namespace osu.Game.Overlays
 
         protected override void PopIn()
         {
-            MoveToX(0, 300, EasingTypes.Out);
+            scrollContainer.MoveToX(0, 600, EasingTypes.OutQuint);
+            sidebar.MoveToX(0, 800, EasingTypes.OutQuint);
             FadeTo(1, 300);
         }
 
         protected override void PopOut()
         {
-            MoveToX(-width, 300, EasingTypes.Out);
+            scrollContainer.MoveToX(-width, 600, EasingTypes.OutQuint);
+            sidebar.MoveToX(-sidebar_width, 600, EasingTypes.OutQuint);
             FadeTo(0, 300);
         }
     }

osu.Game/osu.Game.csproj

@@ -202,7 +202,7 @@
     <Compile Include="Overlays\Options\OptionsSection.cs" />
     <Compile Include="Overlays\Options\OptionsSubsection.cs" />
     <Compile Include="Graphics\UserInterface\LoadingAnimation.cs" />
-    <Compile Include="Overlays\Options\OptionsSideNav.cs" />
+    <Compile Include="Overlays\Options\OptionsSidebar.cs" />
     <Compile Include="Overlays\Options\General\GeneralSection.cs" />
     <Compile Include="Overlays\Options\General\LoginOptions.cs" />
     <Compile Include="Overlays\Options\General\UpdateOptions.cs" />
@@ -251,15 +251,7 @@
   </ItemGroup>
   <ItemGroup />
   <ItemGroup />
-  <ItemGroup>
-    <Folder Include="Overlays\Options\" />
-    <Folder Include="Overlays\Options\General\" />
-    <Folder Include="Overlays\Options\Graphics\" />
-    <Folder Include="Overlays\Options\Gameplay\" />
-    <Folder Include="Overlays\Options\Audio\" />
-    <Folder Include="Overlays\Options\Input\" />
-    <Folder Include="Overlays\Options\Online\" />
-  </ItemGroup>
+  <ItemGroup />
   <Import Project="$(MSBuildToolsPath)\Microsoft.CSharp.targets" />
   <!-- To modify your build process, add your task inside one of the targets below and uncomment it. 
        Other similar extension points exist, see Microsoft.Common.targets.
@@ -268,4 +260,4 @@
   <Target Name="AfterBuild">
   </Target>
   -->
-</Project>
+</Project>