Changes to make Blackjack more resolution independent.

CardsStarterKit/Core/Game/Blackjack/Game/BlackjackCardGame.cs

@@ -95,6 +95,16 @@ namespace Blackjack
             betGameComponent = new BetGameComponent(players, screenManager.InputState, Theme, this, screenManager.SpriteBatch, screenManager.GlobalTransformation);
             Game.Components.Add(betGameComponent);
 
+            // Calculate proportional dimensions
+            int screenWidth = screenManager.SafeArea.Width;
+            int screenHeight = screenManager.SafeArea.Height;
+            int smallPadding = UIConstants.GetSmallPadding(screenWidth);
+            int mediumPadding = UIConstants.GetMediumPadding(screenHeight);
+            int buttonWidth = UIConstants.GetButtonWidth(screenWidth);
+            int buttonHeight = UIConstants.GetButtonHeight(screenHeight);
+            int buttonSpacing = UIConstants.GetButtonSpacing(screenWidth);
+            int wideButtonWidth = UIConstants.GetWideButtonWidth(screenWidth);
+
             // Initialize the game buttons
             string[] buttonsText = { "Hit", "Stand", "Double", "Split", "Insurance" };
             for (int buttonIndex = 0; buttonIndex < buttonsText.Length; buttonIndex++)
@@ -103,9 +113,9 @@ namespace Blackjack
                     screenManager.InputState, this, screenManager.SpriteBatch, screenManager.GlobalTransformation)
                 {
                     Text = buttonsText[buttonIndex],
-                    Bounds = new Rectangle(screenManager.SafeArea.Left + 10 + buttonIndex * 110,
-                        screenManager.SafeArea.Bottom - 60,
-                    100, 50),
+                    Bounds = new Rectangle(screenManager.SafeArea.Left + smallPadding + buttonIndex * buttonSpacing,
+                        screenManager.SafeArea.Bottom - buttonHeight - smallPadding,
+                    buttonWidth, buttonHeight),
                     Font = this.Font,
                     Visible = false,
                     Enabled = false
@@ -119,8 +129,8 @@ namespace Blackjack
             {
                 Text = "New Hand",
 
-                Bounds = new Rectangle(screenManager.SafeArea.Left + 10,
-                    screenManager.SafeArea.Bottom - 60, 200, 50),
+                Bounds = new Rectangle(screenManager.SafeArea.Left + smallPadding,
+                    screenManager.SafeArea.Bottom - buttonHeight - smallPadding, wideButtonWidth, buttonHeight),
                 Font = this.Font,
                 Visible = false,
                 Enabled = false
@@ -129,7 +139,7 @@ namespace Blackjack
             // Alter the insurance button's bounds as it is considerably larger than
             // the other buttons
             Rectangle insuranceBounds = buttons["Insurance"].Bounds;
-            insuranceBounds.Width = 200;
+            insuranceBounds.Width = wideButtonWidth;
             buttons["Insurance"].Bounds = insuranceBounds;
 
             newGame.Click += newGame_Click;

CardsStarterKit/Core/Game/Blackjack/Misc/BetGameComponent.cs

@@ -94,19 +94,29 @@ namespace Blackjack
 
             Rectangle bounds = new Rectangle(0, 0, ScreenManager.BASE_BUFFER_WIDTH, ScreenManager.BASE_BUFFER_HEIGHT);
 
-            positions[chipsAssets.Count - 1] = new Vector2(bounds.Left + 10,
-                bounds.Bottom - size.Height - 80);
+            int smallPadding = UIConstants.GetSmallPadding(bounds.Width);
+            int chipSpacing = UIConstants.GetChipSpacing(bounds.Height);
+            int mediumPadding = UIConstants.GetMediumPadding(bounds.Height);
+            int buttonWidth = UIConstants.GetButtonWidth(bounds.Width);
+            int buttonHeight = UIConstants.GetButtonHeight(bounds.Height);
+            int buttonSpacing = UIConstants.GetButtonSpacing(bounds.Width);
+
+            // Position chip buttons higher to avoid overlap with Deal/Clear buttons
+            // Place them above the buttons with extra spacing
+            int chipAreaBottomMargin = buttonHeight + (smallPadding * 3); // Space for buttons + gap
+            positions[chipsAssets.Count - 1] = new Vector2(bounds.Left + smallPadding,
+                bounds.Bottom - size.Height - chipSpacing - chipAreaBottomMargin);
             for (int chipIndex = 2; chipIndex <= chipsAssets.Count; chipIndex++)
             {
                 size = chipsAssets[assetNames[chipsAssets.Count - chipIndex]].Bounds;
                 positions[chipsAssets.Count - chipIndex] = positions[chipsAssets.Count - (chipIndex - 1)] -
-                    new Vector2(0, size.Height + 10);
+                    new Vector2(0, size.Height + smallPadding);
             }
 
             // Initialize bet button
             bet = new Button("ButtonRegular", "ButtonPressed", input, cardGame, spriteBatch, globalTransformation)
             {
-                Bounds = new Rectangle(bounds.Left + 10, bounds.Bottom - 60, 100, 50),
+                Bounds = new Rectangle(bounds.Left + smallPadding, bounds.Bottom - buttonHeight - smallPadding, buttonWidth, buttonHeight),
                 Font = cardGame.Font,
                 Text = "Deal",
             };
@@ -116,7 +126,7 @@ namespace Blackjack
             // Initialize clear button
             clear = new Button("ButtonRegular", "ButtonPressed", input, cardGame, spriteBatch, globalTransformation)
             {
-                Bounds = new Rectangle(bounds.Left + 120, bounds.Bottom - 60, 100, 50),
+                Bounds = new Rectangle(bounds.Left + smallPadding + buttonWidth + smallPadding, bounds.Bottom - buttonHeight - smallPadding, buttonWidth, buttonHeight),
                 Font = cardGame.Font,
                 Text = "Clear",
             };

CardsStarterKit/Core/Game/Blackjack/UI/UIConstants.cs

@@ -0,0 +1,102 @@
+//-----------------------------------------------------------------------------
+// UIConstants.cs
+//
+// UI scaling constants for resolution-independent rendering in Blackjack
+//-----------------------------------------------------------------------------
+
+namespace Blackjack
+{
+    /// <summary>
+    /// Defines proportional UI constants that scale with screen resolution
+    /// All values are percentages or ratios of screen dimensions
+    /// </summary>
+    public static class UIConstants
+    {
+        // Button dimensions (as percentage of screen dimensions)
+        public const float ButtonWidthRatio = 0.078f;         // ~100px at 1280px width
+        public const float ButtonHeightRatio = 0.069f;        // ~50px at 720px height
+        public const float WideButtonWidthRatio = 0.156f;     // ~200px at 1280px width
+        
+        // Spacing and padding (as percentage of screen dimensions)
+        public const float SmallPaddingRatio = 0.008f;        // ~10px at 1280px
+        public const float MediumPaddingRatio = 0.047f;       // ~60px at 1280px
+        public const float ButtonSpacingRatio = 0.086f;       // ~110px at 1280px
+        public const float ChipSpacingRatio = 0.063f;         // ~80px at 1280px
+        
+        // Text scaling
+        public const float RegularTextScale = 0.6f;
+        public const float SmallTextScale = 0.5f;
+        
+        /// <summary>
+        /// Calculate actual pixel value from screen width ratio
+        /// </summary>
+        public static int GetWidthScaled(int screenWidth, float ratio)
+        {
+            return (int)(screenWidth * ratio);
+        }
+        
+        /// <summary>
+        /// Calculate actual pixel value from screen height ratio
+        /// </summary>
+        public static int GetHeightScaled(int screenHeight, float ratio)
+        {
+            return (int)(screenHeight * ratio);
+        }
+        
+        /// <summary>
+        /// Get standard button width
+        /// </summary>
+        public static int GetButtonWidth(int screenWidth)
+        {
+            return GetWidthScaled(screenWidth, ButtonWidthRatio);
+        }
+        
+        /// <summary>
+        /// Get wide button width (for insurance, new game, etc.)
+        /// </summary>
+        public static int GetWideButtonWidth(int screenWidth)
+        {
+            return GetWidthScaled(screenWidth, WideButtonWidthRatio);
+        }
+        
+        /// <summary>
+        /// Get button height
+        /// </summary>
+        public static int GetButtonHeight(int screenHeight)
+        {
+            return GetHeightScaled(screenHeight, ButtonHeightRatio);
+        }
+        
+        /// <summary>
+        /// Get small padding (10px equivalent)
+        /// </summary>
+        public static int GetSmallPadding(int screenWidth)
+        {
+            return GetWidthScaled(screenWidth, SmallPaddingRatio);
+        }
+        
+        /// <summary>
+        /// Get medium padding (60px equivalent)
+        /// </summary>
+        public static int GetMediumPadding(int screenHeight)
+        {
+            return GetHeightScaled(screenHeight, MediumPaddingRatio);
+        }
+        
+        /// <summary>
+        /// Get button spacing (110px equivalent)
+        /// </summary>
+        public static int GetButtonSpacing(int screenWidth)
+        {
+            return GetWidthScaled(screenWidth, ButtonSpacingRatio);
+        }
+        
+        /// <summary>
+        /// Get chip spacing (80px equivalent)
+        /// </summary>
+        public static int GetChipSpacing(int screenHeight)
+        {
+            return GetHeightScaled(screenHeight, ChipSpacingRatio);
+        }
+    }
+}

CardsStarterKit/Core/Game/Screens/GameplayScreen.cs

@@ -27,12 +27,7 @@ namespace Blackjack
         List<DrawableGameComponent> pauseVisibleComponents = new List<DrawableGameComponent>();
         Rectangle safeArea;
 
-        static Vector2[] playerCardOffset = new Vector2[]
-        {
-            new Vector2(100f, 190f),
-            new Vector2(336f, 210f),
-            new Vector2(570f, 190f)
-        };
+        Vector2[] playerCardOffset;
 
         /// <summary>
         /// Initializes a new instance of the screen.
@@ -54,6 +49,18 @@ namespace Blackjack
         {
             safeArea = ScreenManager.SafeArea;
 
+            // Calculate proportional player positions (better centered and spread out)
+            // These positions should space the three player areas evenly across the table
+            float playerY = safeArea.Height * 0.29f; // ~210px at 720px
+            float centerY = safeArea.Height * 0.26f; // ~190px at 720px - slightly higher for side players
+
+            playerCardOffset = new Vector2[]
+            {
+                new Vector2(safeArea.Width * 0.18f, centerY),   // Left player - moved right (~230px at 1280px)
+                new Vector2(safeArea.Width * 0.42f, playerY),   // Center player - truly centered (~537px at 1280px)
+                new Vector2(safeArea.Width * 0.66f, centerY)    // Right player - balanced (~845px at 1280px)
+            };
+
             // Initialize virtual cursor
             inputHelper = new InputHelper(ScreenManager);
             inputHelper.DrawOrder = 1000;