LinearLayout(선형 레이아웃)


이 섹션 소개

이 섹션은 Android의 레이아웃부터 시작합니다. Android에는 다음과 같은 6가지 주요 레이아웃이 있습니다. LinearLayout(선형 레이아웃), RelativeLayout(상대 레이아웃), TableLayout(테이블 레이아웃) FrameLayout(프레임 레이아웃), AbsoluteLayout(절대 레이아웃), GridLayout(그리드 레이아웃) 오늘 설명할 내용은 첫 번째 레이아웃인 LinearLayout(선형 레이아웃)으로 화면 적응을 사용하는 것입니다. 가장 일반적으로 사용되는 것은 LinearLayout의 가중치(weight 속성)입니다. 이번 섹션에서는 이를 자세히 분석해 보겠습니다. 일부 기본 속성, Weight 속성 사용, 비율 계산 방법을 포함한 LinearLayout 다음으로 덜 사용되는 속성을 말하겠습니다: android:divider는 밑줄을 그립니다!

  1. 이 섹션의 학습 차트

    1.jpg

2. 가중치 속성에 대한 자세한 설명:

①가장 간단한 사용법:

그림과 같이:

2.png

구현 코드:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+ id/LinearLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"    
    android:orientation="horizontal">    ㅋㅋㅋ out.html"     
        android:layout_weight="1" />    ㅋㅋㅋ /images/android-tutorial-linearlayout.html"     
        android:layout_weight="2 "/>    
        
</LinearLayout>

첫 번째 1:1 효과를 얻으려면 두 개의 LinearLayout의 가중치를 각각 1과 1로 변경하기만 하면 됩니다. 사용법 요약: 가로 방향을 비례적으로 나누기: 해당 View의 android:width 속성을 0dp로 설정한 후 android로 설정합니다. 가중치 속성은 비율로 설정할 수 있습니다. 수직 방향에서는 android:height를 0dp로 설정한 다음 가중치 속성을 설정하면 됩니다. 세로 등비분할을 직접 작성하고 간단한 사용법을 경험해 보세요!

② 가중치 속성에 대한 자세한 설명:

물론, 위의 0dp 설정 방법을 적용하지 않고, Wrap_content와 match_parent를 직접 사용한다면, 그런 다음 Wrap_content와 match_parent라는 두 가지 상황으로 구분되는 가중치 속성을 구문 분석해야 합니다! 또한 시청하세요 LinearLayout의 방향이 가로인지 세로인지에 따라 균등하게 나눌 방향이 결정됩니다.

1) Wrap_content는 상대적으로 단순하고 비례적입니다

3.png

구현 코드:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+ id/LinearLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent"  
    android:orientation="horizontal" >    ㅋㅋㅋ roid:text="one"     
        android:Background="../style/images/ android-tutorial-linearlayout.html"    
     />    
     <TextView    
        android:layout_weight="2"    
        android:layout_width="wrap_content"    
        android:layout_height="fill_parent"    
        Android:text="two"     
        android:Background="../style/images/android -tutorial-linearlayout.html"    
     />    ㅋㅋㅋ     
        android:Background="../style/images/android -tutorial-linearlayout.html"    
     />    
    
</LinearLayout>

2)match_parent(fill_parent): 계산이 필요합니다

다음과 같은 간단한 코드를 작성해 보겠습니다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+id/LinearLayout1"    
    android:layout_width="match_parent"    
    android:layout_height="match_parent" >    
    
    <TextView    
        android:layout_weight="1"    
        android:layout_width="fill_parent"    
        android:layout_height="fill_parent"    
        android:text="one"     
        android:background="../style/images/android-tutorial-linearlayout.html"    
     />    
     <TextView    
        android:layout_weight="2"    
        android:layout_width="fill_parent"    
        android:layout_height="fill_parent"    
        android:text="two"     
        android:background="../style/images/android-tutorial-linearlayout.html"    
     />    
     <TextView    
        android:layout_weight="3"    
        android:layout_width="fill_parent"    
        android:layout_height="fill_parent"    
        android:text="three"     
        android:background="../style/images/android-tutorial-linearlayout.html"    
     />    
    
</LinearLayout>

작업 렌더링:

4.png

이때, 어떻게 이런 일이 일어날 수 있는지 의문이 들 것입니다. 비율이 2:1인데 3명은 어디로 갔습니까? 코드에 분명히 나와있어요 3개도 3으로 설정되어 있는데 1:2:3이 2:1:0이 되는군요. 답변: 실제로는 그렇게 간단하지 않습니다. 인터넷에 몇 가지 알고리즘이 나와 있습니다. 제가 생각하기에 더 이해하기 쉬운 방법은 다음과 같습니다. 1단계: 모든 사람이 fill_parent이지만 화면은 하나뿐입니다. 그러면 1 - 3 = - 2 fill_parent 2단계: 비율은 1/6, 2/6입니다. 3 /63단계:선착순, 한 명에게 먼저 할당, 계산: 1 - 2 * (1/6) = 2/3 fill_parent ​ ​ 2 옆에 다음을 계산합니다. 1 - 2 * (2/6) = 1/3 fill_parent ​ ​ ​ 마지막으로 3이 나와서 1 - 2 * (3/6) = 0을 계산합니다. fill_parent4단계: 그래서 최종 결과는 다음과 같습니다. 하나는 두 개의 공유를 차지하고, 둘은 하나의 공유를 차지하고, 셋은 아무것도 없습니다. 위의 내용은 3가지가 나타나지 않는 이유입니다. 몇 가지 예를 더 들어보면 알 수 있을 것입니다.

비율은 1:1:1

5.png

위의 계산 방법에 따라 계산하면 결과는 1/3 1/3 1/3, 맞습니다.

다시 시도해 보세요: 2:3:4

6.png

계산 결과: 5/9 3/9 1/9. 렌더링을 비교하면 5:3:1이 정확하므로 이 계산 방법을 표시해야 합니다!

③Java 코드에서 가중치 속성을 설정합니다.

setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,
        LayoutParams.WRAP_CONTENT, 1));

3. LinearLayout의 구분선 설정

많은 인터페이스 개발에서는 다음 Kugou와 같이 인터페이스를 더욱 깔끔하고 아름답게 만들기 위해 일부 밑줄이나 구분선을 설정합니다. 음악 등록 페이지:

7.jpg

이런 종류의 라인에는 일반적으로 레이아웃에 뷰를 직접 추가하는 두 가지 방법이 있습니다. 이 뷰의 기능은 라인을 표시하는 것 뿐이며 코드도 매우 간단합니다.

<보기
android:layout_width="match_parent"
android:layout_height="1px"
android:Background="../style/images/android-tutorial-linearlayout.html" />

가로방향의 검정색 선입니다. 물론 다른 색상으로 바꾸거나 사진을 활용하셔도 됩니다.

20682772.jpg

②두 번째 방법은 LinearLayout의 구분선 속성을 사용하여 LinearLayout의 구분선을 직접 설정하는 것입니다. 여기서 라인 사진을 직접 준비해야합니다 1) android:divider는 그림을 구분선으로 설정합니다. 2) android:showDividers는 구분선의 위치를 ​​없음(none), 시작(start), 끝(end), 중간(각 두 구성 요소 사이)으로 설정합니다. 3)dividerPadding은 구분선의 패딩을 설정합니다.

사용 예:

8.jpg

구현 코드:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    xmlns:tools="http://schemas.android.com/tools"  
    android:id="@+ id/LinearLayout1"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    android:divider="@drawable/ktv_line_div"  
    android:orientation="vertical"  
    android:showDividers=" 중간"  
    안드로이드: DividerPadding="10dp"  
    tools:context="com.jay.example.linearlayoutdemo.MainActivity" >  
  
    <버튼  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:text="按钮1" />  
  
    <버튼  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:text="按钮2" />  
  
    <버튼  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:text="按钮3" />  
  
</LinearLayout>

4. LinearLayout의 간단한 예:

9.jpg

구현 코드는 다음과 같습니다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    
    xmlns:tools="http://schemas.android.com/tools"    
    android:id="@+ id/LinearLayout1"    
    android:layout_width="fill_parent"    
    android:layout_height="fill_parent"    
    android:orientation="vertical"    
    tools:context=".MainActivity" >    ㅋㅋㅋ的电话号码"/>    
    <EditText    
        android:layout_width="fill_parent"    
        android:layout_height="wrap_content"/>    ㅋㅋㅋ ity="맞습니다">    ㅋㅋㅋ    
        <버튼    
            android:layout_width="wrap_content"    
            android:layout_height="wrap_content"    
            android:text="清空"/>    
    </LinearLayout>    
</LinearLayout>

5. 참고 사항:

Layout_gravity를 사용할 때 매우 중요한 문제!!! 질문 내용: 두 개의 TextView를 LinearLayout의 가로 방향으로 정렬하고 하나는 왼쪽에, 다른 하나는 오른쪽에 배치하는 방법은 무엇입니까? 어쩌면 당신은 "중력에 대해 왼쪽과 오른쪽을 설정하세요!"라고 무뚝뚝하게 말할 수도 있습니다. 정말 그렇게 간단합니까? 간단한 레이아웃을 작성해 보면 역효과를 보게 될 것입니다. 코드는 다음과 같습니다:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context="com.jay.example.getscreendemo.MainActivity"> _width="wrap_content"
 android:layout_height="200dp"
android: layout_gravity="left"
android:Background="../style/images/android-tutorial-linearlayout.html"
android:gravity="center"
android:text="O( ∩_∩)오하하~" / >

<TextView
android:layout_width="wrap_content"
android:layout_height="200dp"
android:layout_gravity=" right"
android:Background="../style /images/android-tutorial-linearlayout. html"                                   android:gravity="center"                                                                                                                  선형 레이아웃     

실행 결과 그래프:

10.jpg

이것을 보면 다음과 같이 말할 것입니다: 아, 정말 작동하지 않습니다. 외부 LinearLayout에 중력=왼쪽 속성을 추가한 다음 두 번째 속성을 설정하는 것은 어떻습니까? TextView의layout_gravity가 맞습니다. 한번 시도해 보겠습니다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="left"
tools:context="com.jay.example.getscreendemo.MainActivity" >

<텍스트 보기
android :layout_width="wrap_content"
android:layout_height="200dp"
android:Background="../style/images/android-tutorial-linearlayout.html"
android:gravity="center"
텍스트 android:text =" 오( ∩_∩)오하하~" />

<TextView
android:layout_width="wrap_content"
android:layout_height="200dp"
android:layout_gravity=" 오른쪽"
android:Background="../ 스타일 /images/android-tutorial-linearlayout.html"                                   android:gravity="center"                                                    >

결과는 여전히 동일합니다.

12.jpg

알았어, 난 도저히 모르겠어. 어떻게 해야 하지?

android:orientation="vertical"을 사용하면 가로 설정만 적용되고 세로 설정은 적용되지 않습니다. 즉, 왼쪽, 오른쪽, center_horizontal이 유효합니다. android:orientation="horizontal"을 사용하면 수직 설정만 적용되고 수평 설정은 적용되지 않습니다. 즉, 상단, 하단, center_vertical이 유효합니다.

그러나 이 방법은 별 쓸모가 없는 것 같습니다. 예를 들어: 수직 방향으로 왼쪽 및 오른쪽 정렬만 설정할 수 있는 경우 다음과 같은 효과가 나타납니다.

13.jpg

이것은 분명히 우리가 원하는 결과가 아닙니다! 요약하면 위에 제시된 규칙에 따라 레이아웃을 지정하거나 이 경우 상대 레이아웃을 사용하십시오. RelativeLayout! 인터넷상에는 구체적인 이유가 나와 있지 않습니다. 모두 이것이 변화라고 말합니다. 어떤 사람들은 이것이 오리엔테이션 우선 순위와 관련이 있다고 말합니다. , 지금은 표시해두고 나중에 이유를 알면 설명하겠습니다! 이전에 화면 적응에 대해서도 언급했는데, 레이아웃은 여전히 ​​권장됩니다. 상대 레이아웃!


←
→

PHP 중국어 웹사이트

집집강의강의기사기사Q&AQ&A사전사전수동수동다운로드다운로드찾다찾다APP다운로드 APP다운로드