Play Buttons are the correct aspect ratio. Needs work on positioning and functionality

WitchQueen/core/src/main/kotlin/com/iofferyoutea/WitchQueen/Button.kt

@@ -2,6 +2,7 @@ package com.iofferyoutea.WitchQueen
 
 import com.badlogic.gdx.graphics.Texture
 import com.badlogic.gdx.graphics.g2d.BitmapFont
+import com.badlogic.gdx.scenes.scene2d.ui.Container
 import com.badlogic.gdx.scenes.scene2d.ui.TextButton
 import com.badlogic.gdx.scenes.scene2d.ui.TextButton.TextButtonStyle
 import com.badlogic.gdx.scenes.scene2d.utils.TextureRegionDrawable
@@ -16,4 +17,5 @@ open class Button(val upTexturePath: String, val downTexturePath: String, val fo
     val buttonStyle = TextButtonStyle().apply { up = buttonUp; down = buttonDown; font = buttonFont }
 
     val button = TextButton(defaultText, buttonStyle)
+    val container = Container<TextButton>(button)
 }

WitchQueen/core/src/main/kotlin/com/iofferyoutea/WitchQueen/MainMenu.kt

@@ -2,22 +2,35 @@ package com.iofferyoutea.WitchQueen
 
 import com.badlogic.gdx.Gdx
 import com.badlogic.gdx.graphics.Texture
+import com.badlogic.gdx.scenes.scene2d.InputEvent
 import com.badlogic.gdx.scenes.scene2d.Stage
 import com.badlogic.gdx.scenes.scene2d.ui.Button.ButtonStyle
 import com.badlogic.gdx.scenes.scene2d.ui.HorizontalGroup
 import com.badlogic.gdx.scenes.scene2d.ui.ImageButton
 import com.badlogic.gdx.scenes.scene2d.ui.Table
 import com.badlogic.gdx.scenes.scene2d.ui.VerticalGroup
+import com.badlogic.gdx.scenes.scene2d.utils.ClickListener
 import com.badlogic.gdx.scenes.scene2d.utils.TextureRegionDrawable
+import com.badlogic.gdx.utils.Logger
+import com.badlogic.gdx.utils.viewport.ScreenViewport
+import com.badlogic.gdx.utils.viewport.Viewport
+import ktx.actors.centerPosition
+import ktx.actors.setPosition
 import ktx.app.KtxScreen
 import ktx.app.clearScreen
 
 class MainMenu : KtxScreen {
+    val viewport = ScreenViewport().apply {
+
+    }
+
     val table = Table().apply {
         setFillParent(true)
         debug = true
     }
-    val stage = Stage().apply {
+    val stage = Stage(viewport).apply {
+        Gdx.app.log("WitchQueen", "Width: " + viewport.screenWidth.toString() + " Height: " + viewport.screenHeight.toString())
+
         Gdx.input.inputProcessor = this
         addActor(table)
     }
@@ -62,7 +75,11 @@ class MainMenu : KtxScreen {
         "Casual",
         true,
         2f
-    )
+    ).apply { // Could probably do this in Button. Just take in width and aspect ratio and padding?
+        container.width(viewport.screenWidth * 0.375f)
+        container.height(((viewport.screenWidth * 0.375f) * 3f) / 4) // container.width is 0. We need to work out the width again.
+        container.padLeft(viewport.screenWidth * 0.1f)
+    }
 
     // Competitive Button
     val competitiveButton = Button(
@@ -72,18 +89,45 @@ class MainMenu : KtxScreen {
         "Competitive",
         true,
         2f
-    )
+    ).apply {
+        container.width(viewport.screenWidth * 0.375f)
+        container.height(((viewport.screenWidth * 0.375f) * 3f) / 4) // container.width is 0. We need to work out the width again.
+        container.padLeft(viewport.screenWidth * 0.05f)
+    }
 
     val playButtonGroup = HorizontalGroup().apply {
-        addActor(casualButton.button)
+        addActor(casualButton.container)
-        addActor(competitiveButton.button)
+        addActor(competitiveButton.container)
-        table.add(this)
+
+        table.add(this).width(viewport.screenWidth.toFloat())
+    }
+
+    // Methods
+    private fun processInput() {
+        casualButton.button.addListener(object : ClickListener() {
+            override fun touchUp(
+                event: InputEvent?,
+                x: Float,
+                y: Float,
+                pointer: Int,
+                button: Int
+            ) {
+                Gdx.app.log("My Project", "Clicked!")
+            }
+        })
+    }
+
+    override fun resize(width: Int, height: Int) {
+        super.resize(width, height)
+        stage.viewport.update(width, height, true)
     }
 
     override fun render(delta: Float) {
         super.render(delta)
         clearScreen(0f, 255f, 0f)
 
+        processInput()
+
         stage.act(delta)
         stage.draw()
     }