title: Libgdx Scene2dUi and Viewport
body: <p>I have made my layout in scene 2d and implemented it. But the sizing is the issue. It comes in different alignment for my android phone and on desktop.</p>
  
  <p>Although I think that the solution is to use viewport but I don't know how to correctly implement it.</p>
  
  <p>The way I am implementing it gives me a white screen</p>
  
  <pre><code> @Override
    public void show() {
      width=GameScreen.getGameWidth();
      height=GameScreen.getGameHeight();
      camera = new OrthographicCamera();
      camera.setToOrtho(true,width ,height);
  
      stage = new Stage(new FillViewport(width, height,camera)); 
  
      parameter.size = 40;
      parameter.color=Color.WHITE;
      parameter.flip=false;
      font12 = generator.generateFont(parameter); // font size 12 pixels
      generator.dispose();
  
      TextureAtlas atlas= new TextureAtlas(Gdx.files.internal("data/uiAtlas.atlas"));
      skin = new Skin(Gdx.files.internal("data/uiskin.json"));
      skin2= new Skin(Gdx.files.internal("data/achievementSkin.json"),atlas);
      Gdx.input.setInputProcessor(stage);
  
      mainTable = new Table();
      levelTable = new Table();
  
      stage.addActor(mainTable);
      mainTable.setFillParent(true);
  
      scrollPane = new ScrollPane(levelTable, skin);
      scrollPane.setFlickScroll(true);
      scrollPane.setFadeScrollBars(true);
  
      labelStyle=new LabelStyle();
      labelStyle.font=font12;
  
      makeLevelMenu();
  }
  
  
  
  public void makeLevelMenu() {
      for (int i = 0; i &lt; 10; i++) {
          columnTable.add(new Table());
  
          // Image
          button.add(new ImageButton(skin2, "playButton"));
          columnTable.get(i).add(button.get(i)).colspan(2).padBottom(100)
                  .padLeft(100).padRight(100).padTop(100);
  
          columnTable.get(i).row();
          // Enemy Label
          enemyLabel.add(new Label("Enemy " + (i + 1), labelStyle));
          columnTable.get(i).add(enemyLabel.get(i)).left().padBottom(300)
                  .padTop(100);
  
          columnTable.get(i).row();
          // Battle Style
          battleStyle.add(new Label("Battle Style " + (i + 1), labelStyle));
          columnTable.get(i).add(battleStyle.get(i)).left().padBottom(100);
  
          levelTable.add(columnTable.get(i)).expand();
      }
      levelTable.debug();
      // achievementsTable.setFillParent(true);
      for (int i = 0; i &lt; button.size(); i++) {
          final int k = i;
          button.get(k).addListener(new InputListener() {
              public boolean touchDown(InputEvent event, float x, float y,
                      int pointer, int button) {
                  System.out.println("Level " + (k + 1) + "touchDown");
                  return true;
              }
  
              public void touchUp(InputEvent event, float x, float y,
                      int pointer, int button) {
  
              }
          });
      }
      scrollPane.setScrollingDisabled(false, false);
      mainTable.add(scrollPane).expand().fill();
  }
  
  
  
  @Override
  public void render(float delta) {
      Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
      Gdx.gl20.glClearColor(1, 1, 1, 1);
      stage.act(delta);
      stage.draw();
  }
  
  @Override
  public void resize(int width, int height) {
      stage.getViewport().update(width, height, true);
  }
  </code></pre>