Как создать этот пользовательский интерфейс программно в android

Question

Прямоугольник - это весь экран. Пунктирная линия представляет собой центр высоты и ширины. Каждая красная линия представляет собой изображение, а зеленая точка - это центр изображения. Каждое изображение равноудалено от соседнего изображения и экрана (по высоте)

Я проектирую основное меню для своего маленького игрового приложения, которое должно работать на всех экранах, как показано на рисунке. Я просмотрел множество руководств и придумал следующий код, но я не получаю ожидаемого результата. В одном эмуляторе последнее изображение не видно, а образы не центрированы. В моем туре галактики samsung видно только первое изображение. Что-то не так с кодом.?

package com.example.layout_test2; 

import android.os.Build; 
import android.os.Bundle; 
import android.annotation.SuppressLint; 
import android.app.Activity; 
import android.graphics.Bitmap; 
import android.graphics.BitmapFactory; 
import android.graphics.Point; 
import android.util.DisplayMetrics; 
import android.util.Log; 
import android.view.ViewGroup.LayoutParams; 
import android.widget.ImageView; 
import android.widget.LinearLayout; 


public class MainActivity extends Activity { 

int screenWidth,width_centre; 
int screenHeight,first_icon_position,second_icon_position,third_icon_position,fourth_icon_position; 

@SuppressLint("NewApi") 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 

     LinearLayout background= new LinearLayout(this); 
     background.setOrientation(LinearLayout.VERTICAL); 
     background.setLayoutParams(new LayoutParams(
       LayoutParams.MATCH_PARENT, 
       LayoutParams.MATCH_PARENT)); 


     ImageView icon_1 = new ImageView(this); 
     ImageView icon_2 = new ImageView(this); 
     ImageView icon_3 = new ImageView(this); 
     ImageView icon_4 = new ImageView(this); 

     icon_1.setScaleType(ImageView.ScaleType.MATRIX); 
     icon_1.setImageResource(R.drawable.start); 
     //icon_1.setOnClickListener(this); 

     BitmapFactory.Options o = new BitmapFactory.Options(); 
     o.inTargetDensity = DisplayMetrics.DENSITY_DEFAULT; 
     Bitmap bmp = BitmapFactory.decodeResource(getResources(), R.drawable.start, o); 
     int w1 = bmp.getWidth(); 
     int h1 = bmp.getHeight(); 

     icon_2.setScaleType(ImageView.ScaleType.MATRIX); 
     icon_2.setImageResource(R.drawable.settings); 
     bmp = BitmapFactory.decodeResource(getResources(), R.drawable.settings, o); 
     int w2 = bmp.getWidth(); 
     int h2 = bmp.getHeight(); 

     icon_3.setScaleType(ImageView.ScaleType.MATRIX); 
     icon_3.setImageResource(R.drawable.more_games); 
     bmp = BitmapFactory.decodeResource(getResources(), R.drawable.more_games, o); 
     int w3 = bmp.getWidth(); 
     int h3 = bmp.getHeight(); 


     icon_4.setScaleType(ImageView.ScaleType.MATRIX); 
     icon_4.setImageResource(R.drawable.exit); 
     bmp = BitmapFactory.decodeResource(getResources(), R.drawable.exit, o); 
     int w4 = bmp.getWidth(); 
     int h4 = bmp.getHeight(); 



     if (Build.VERSION.SDK_INT >= 17) { 
      Point size = new Point(); 
      try { 
       this.getWindowManager().getDefaultDisplay().getRealSize(size); 
       screenWidth = size.x; 
       screenHeight = size.y; 
       System.out.println(String.valueOf(screenWidth)); 
       System.out.println(String.valueOf(screenHeight)); 
      } catch (NoSuchMethodError e) { 
       Log.i("error", "it can't work"); 
      } 

     } else { 
      DisplayMetrics metrics = new DisplayMetrics(); 
      this.getWindowManager().getDefaultDisplay().getMetrics(metrics); 
      screenWidth = metrics.widthPixels; 
      screenHeight = metrics.heightPixels; 
      System.out.println(String.valueOf(screenWidth)); 
      System.out.println(String.valueOf(screenHeight)); 


    } 

     int width_centre1 = (screenWidth-w1)/2; 
     int width_centre2 = (screenWidth-w2)/2; 
     int width_centre3 = (screenWidth-w3)/2; 
     int width_centre4 = (screenWidth-w4)/2; 


     first_icon_position = (int) (screenHeight-h1)/8; 
     second_icon_position = (int) 3*(screenHeight-h2)/8; 
     third_icon_position = (int) 5*screenHeight/8; 
     fourth_icon_position = (int) 7*screenHeight/8; 


     System.out.println(screenHeight); 
     System.out.println(first_icon_position); 
     System.out.println(second_icon_position); 
     System.out.println(third_icon_position); 
     System.out.println(fourth_icon_position); 

     LinearLayout.LayoutParams layoutParams1 = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); 
     layoutParams1.setMargins(width_centre1,first_icon_position, 0, 0); 
     background.addView(icon_1,layoutParams1); 

     LinearLayout.LayoutParams layoutParams2 = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); 
     layoutParams2.setMargins(width_centre2,second_icon_position, 0, 0); 
     background.addView(icon_2,layoutParams2); 


     LinearLayout.LayoutParams layoutParams3 = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); 
     layoutParams3.setMargins(width_centre3,300, 0, 0); 
     background.addView(icon_3,layoutParams3); 


     LinearLayout.LayoutParams layoutParams4 = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); 
     layoutParams4.setMargins(width_centre4,180, 0, 0); 
     background.addView(icon_4,layoutParams4); 


     //make visible to program 
     setContentView(background); 


} 
} 

Answer 1

Хорошо, это, как я сделал макет, который очень похож на тот, который вы просили, только с помощью макетов вместо кода;)

Результаты:

(240 * 320 ldpi экран)

(320 * 480 MDPI экран)

Изображение, которые я использовал:

(красная линия, разреш/вытяжка/line_hor_red)

(невидимая линия в центре, Res/вытяжке/line_hor_tsp)

Следующих два выглядит одинаково, но Арен «т

(горизонтальный точечный узор, разреш/вытяжке/ptn_hor_blk)

(вертикальный точечный узор, Рез/рисуем/ptn_ver_blk)

Теперь, когда вы должны поместить изображения в Рез/рисуемых (или в Рез/рисуемых-MDPI - что является нормальным разрешением, и это будет масштабироваться, чтобы соответствовать всем другим), сделайте следующее:

Put в вашем разрешении/вытяжке папки эти две раскладки:

dots_hor:

<?xml version="1.0" encoding="utf-8"?> 
<bitmap 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:src="@drawable/ptn_hor_blk" 
    android:tileMode="repeat" 
/> 

dots_ver:

<?xml version="1.0" encoding="utf-8"?> 
<bitmap 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:src="@drawable/ptn_ver_blk" 
    android:tileMode="repeat" 
/> 

Это макет вы хотите (фон.XML)

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#000" 
    > 
    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_margin="4dp" 
     android:background="#fff" 
     android:orientation="vertical" 
     > 
     <ImageView 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:layout_centerInParent="true" 
      android:background="@drawable/dots_hor" 
     /> 
     <ImageView 
      android:layout_width="wrap_content" 
      android:layout_height="fill_parent" 
      android:layout_centerInParent="true" 
      android:background="@drawable/dots_ver" 
     /> 
     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_margin="4dp" 
      android:background="#0000" 
      android:orientation="vertical" 
      > 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_tsp" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
     </LinearLayout> 
    </RelativeLayout> 
</RelativeLayout> 

[EDIT]

АЛЬТЕРНАТИВА МАКЕТ, БЕЗ ТОЧЕК

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#000" 
    > 
    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_margin="4dp" 
     android:background="#fff" 
     android:orientation="vertical" 
     > 
     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_margin="4dp" 
      android:background="#0000" 
      android:orientation="vertical" 
      > 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_tsp" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
      <ImageView 
       android:layout_width="wrap_content" 
       android:layout_height="0dp" 
       android:layout_gravity="center_horizontal" 
       android:layout_weight="1" 
       android:src="@drawable/line_hor_red" 
      /> 
     </LinearLayout> 
    </RelativeLayout> 
</RelativeLayout> 

Это означает, что вам не нужно Drawable/dots_hor, Drawable/dots_ver, drawable/ptn_hor_blk, drawable/pt n_ver_blk

[/ EDIT]

Что вы будете нуждаться в вашей MainActivity:

import android.view.Window; 
import android.view.WindowManager; 

И

@Override 
protected void onCreate(
    final Bundle savedInstanceState) 
{ 
    super.onCreate(savedInstanceState); 

    // Make this activity, full screen 
    getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, 
     WindowManager.LayoutParams.FLAG_FULLSCREEN); 

    // Hide the Title bar of this activity screen 
    getWindow().requestFeature(Window.FEATURE_NO_TITLE); 

    setContentView(R.layout.background); 
} 

И последнее, но не в последнюю очередь, если я помог вы, не забудьте ept мой ответ и upvote.