프로그래밍 초보자는 안드로이드 프로그램 제작에 실패했다.레이아웃 편(단말기별 해상도)

■ 우선

응용 소프트웨어 개발 경험 & 프로그래밍 초보자 없음.나는 이전보다 응용 프로그램을 더 만들고 싶어서 도전했다.
제작 과정에서 겪는 좌절과 해결 방법은 모두 초보자가 직접 작성한 것인데, 앞으로 안드로이드 앱을 개발하는 분들에게 참고가 될 수 있다면 좋겠다.

■ 개발 환경

AndroidStudio2.2.2 (2016년에 제작되었기 때문에 좀 낡았다.)

JDK8

■ 걸려 넘어지는 일

크기를 지정하고 이미지의 버튼 등을 임의의 위치에 배치하려는 경우.기본적으로 탑재된 레이아웃 기능에서는 장치마다 화면 해상도가 다르게 대응할 수 없다.GridLayout, RelativeLayout 등

예: 장치: Nexus 4.이미지 1 ~ 이미지 6 까지 임시 단추 구성

↓ 장치: Nexus 7로 변경

그림이 엉망진창으로 비쳤다.
○○%까지 해냈으면 좋겠는데...
따라서 자바의 기술에서 장치마다 화면 해상도가 다르게
※ Android Support Library 23.0에서 제공하는'PercentRelative Layout'을 사용하면 이미지의%를 지정할 수 있습니다.
이번에는 학습뿐만 아니라 자바의 기술로 장치의 화면 해상도가 다르도록 시도해 봤다.(다중 장치는 지원되지 않음)
참조: https://qiita.com/komatatsu/items/c9ea73de513dd287aacb

■ 자바에서 하는 일

onwindowFocusinged 방법으로 표시된 단말기의 화면 너비

얻은 화면 폭을 사용하여 확대비를 정의하여 적당한 크기로 그림을 표시합니다.

얻은 화면 너비와 확장비에 따라 계산된 이미지 너비를 사용하여 적당한 페이지 간격을 정의한다.

이번에는 단말기의 세로만 지원합니다(가로 또는 태블릿PC 대응자는if문구로 따로 처리하세요).

이미지 1 = Buton01
이미지.2 = Buttton02
이미지.3 = Button03
이미지 4. = Buton04
이미지 5. = Buton05
이미지.6 = Button06
다음 레이아웃용 프로그램
MainActivity.java

    /*onWindowFocusChanged()を使います*/
    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        super.onWindowFocusChanged(hasFocus);

        RelativeLayout layout = (RelativeLayout) findViewById(R.id.mainLayout);

        /*画面（デバイス）の幅,高さを取得*/
        float mainHeight = layout.getHeight();
        float mainWidth = layout.getWidth();


        /*取得したレイアウトの幅"A"とし、配置したい画像の幅"B"とした場合
        "B"が端末内で想定した大きさになる拡縮比が"A/4"*/
        float mainIconScale = layout.getWidth() / 4; 


        /*各画像をfindViewByIdで取得。"各iconに格納"*/
        ImageButton icon1 = (ImageButton) findViewById(R.id.Button01);
        ImageButton icon2 = (ImageButton) findViewById(R.id.Button02);
        ImageButton icon3 = (ImageButton) findViewById(R.id.Button03);
        ImageButton icon4 = (ImageButton) findViewById(R.id.Button04);
        ImageButton icon5 = (ImageButton) findViewById(R.id.Button05);
        ImageButton icon6 = (ImageButton) findViewById(R.id.Button06);


        /*取得した画像の幅を.getWidth()で取得。"iconOriginWidth"に格納*/
        /*サイズの違う画像を配置する場合は別途取得してください*/
        float iconOriginWidth = icon1.getWidth();


        /*拡縮比 / 元画像幅 ＝ 画像の縮小比を定義、取得する*/
        float iconScale = mainIconScale / iconOriginWidth;


        /*定義した比率から表示するicon幅,余白を取得する*/
        int iconWidth = (int) (iconOriginWidth * iconScale);
        int iconMargin = (int)(mainWidth - iconWidth * 3) / 4;


        /*icon画面出力*/
        FrameLayout.LayoutParams params1 =
                new FrameLayout.LayoutParams(iconWidth, iconWidth);
        params1.leftMargin = (int) (iconMargin * 1.2);  //画像.1の左の余白を定義
        params1.topMargin = (int) (iconMargin * 2.5);  //画像.1の上の余白を定義
        icon1.setLayoutParams(params1);

        FrameLayout.LayoutParams params2 =
                new FrameLayout.LayoutParams(iconWidth, iconWidth);
        params2.leftMargin = (int) (iconMargin * 2.0 + iconWidth);  //画像.2の左の余白を定義
        params2.topMargin = (int) (iconMargin * 2.5);  //画像.2の上の余白を定義
        icon2.setLayoutParams(params2);

        FrameLayout.LayoutParams params3 =
                new FrameLayout.LayoutParams(iconWidth, iconWidth);
        params3.leftMargin = (int) (iconMargin * 2.8 + iconWidth * 2);
        params3.topMargin = (int) (iconMargin * 2.5);
        icon3.setLayoutParams(params3);

        FrameLayout.LayoutParams params4 =
                new FrameLayout.LayoutParams(iconWidth, iconWidth);
        params4.leftMargin = (int) (iconMargin * 1.2);
        params4.topMargin = (int) (iconMargin * 3.1 + iconWidth);
        icon4.setLayoutParams(params4);

        FrameLayout.LayoutParams params5 =
                new FrameLayout.LayoutParams(iconWidth, iconWidth);
        params5.leftMargin = iconMargin * 2 + iconWidth;
        params5.topMargin = (int) (iconMargin * 3.1 + iconWidth);
        icon5.setLayoutParams(params5);

        FrameLayout.LayoutParams params6 =
                new FrameLayout.LayoutParams(iconWidth, iconWidth);
        params6.leftMargin =(int) (iconMargin * 2.8 + iconWidth * 2);
        params6.topMargin = (int) (iconMargin * 3.1 + iconWidth);
        icon6.setLayoutParams(params6);
    }

■ 결과

예: 왼쪽 장치: Nexus 7 오른쪽 장치: Nexus 10

↑ 이해하기 어렵지만 화면 해상도가 다르다

■소감

xml의 레이아웃 기능에 의존하지 않아도 자바의 맞춤법으로 판단할 수 있습니다.
지금부터 안드로이드 프로그래밍을 시작하는 사람에게는 일종의 학습이기 때문에 자바로 레이아웃 디자인을 쓰는 것을 추천합니다.
※ 초보자의 필법이기 때문에 효율적이고 좋은 방법이 많다.느린 코드지만 용서해 주세요