IT story

CoordinatorLayout이란 무엇입니까?

hot-time 2020. 9. 14. 21:43
반응형

CoordinatorLayout이란 무엇입니까?


새로운 Android 지원 디자인 라이브러리의 데모 앱을 살펴 보았습니다. Chris Banes가 github 에서 제공합니다 . 앱을 통해 CoordinatorLayout무겁게 사용됩니다. 또한, 예컨대 상기지지 설계 라이브러리 많은 클래스 FloatingActionButton, SnackBar, AppBarLayout등을 다르게 행동한다 때 사용되는 내부 CoordinatorLayout.

누군가 가 안드로이드의 CoordinatorLayout다른 것들 과 어떻게 다른지 에 대해 조명을 비추 ViewGroup거나 적어도 학습을 향한 올바른 경로를 제공 할 수 있습니까 CoordinatorLayout?


여기 당신이 찾고 있습니다.

문서에서

디자인 라이브러리는 디자인 라이브러리의 CoordinatorLayout많은 구성 요소가 활용하는 하위보기 간의 터치 이벤트에 대한 추가 수준의 제어를 제공하는 레이아웃을 도입 합니다.

https://android-developers.googleblog.com/2015/05/android-design-support-library.html

이 링크에서는 위에서 언급 한 모든 뷰의 데모 비디오를 볼 수 있습니다.

도움이 되었기를 바랍니다 :)


CoordinatorLayout이란 무엇입니까? 멋진 이름이 당신을 속이게하지 마십시오. 그것은 스테로이드에 대한 FrameLayout에 지나지 않습니다.

이 무엇인지 CoordinatorLayout/ 하는 일을 가장 잘 이해하려면 먼저 Coordinate의 의미를 이해하고 염두에 두어야합니다.

당신이 단어를 구글하면

동등 어구

이것이 당신이 얻는 것입니다.

여기에 이미지 설명 입력

이러한 정의는 CoordinatorLayout이 자체적으로 수행하는 작업과 내부 뷰가 어떻게 작동하는지 설명하는 데 도움이된다고 생각합니다.

CoordinatorLayout (a ViewGroup)은 다른 요소 (하위 뷰)를 제공합니다.

CoordinatorLayout의 도움으로 자식 뷰는 조화롭게 함께 작동하여 다음과 같은 멋진 동작을 구현합니다.

드래그, 스 와이프, 플링 또는 기타 제스처.

CoordinatorLayout 내부의 뷰는 이러한 Behaviors 를 지정하여 효과적으로 협력하기 위해 다른 사용자와 협상합니다.

CoordinatorLayout은 매력적이고 조화로운 레이아웃을 만드는 데 도움이되는 머티리얼 디자인의 멋진 기능입니다.

CoordinatorLayout 안에 자식 뷰를 래핑하기 만하면됩니다.

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout        
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:fitsSystemWindows="true"
 tools:context="com.byte64.coordinatorlayoutexample.ScollingActivity">

 <android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="@dimen/app_bar_height"
    android:fitsSystemWindows="true"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">



        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_collapseMode="pin"
            app:popupTheme="@style/AppTheme.PopupOverlay" />
        <TableLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

<include layout="@layout/content_scolling" />

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/fab_margin"
    app:layout_anchor="@id/app_bar"
    app:layout_anchorGravity="bottom|end"
    app:srcCompat="@android:drawable/ic_dialog_email" />

 </android.support.design.widget.CoordinatorLayout>

및 content_scrolling :

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView     
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 app:layout_behavior="@string/appbar_scrolling_view_behavior"
 tools:context="com.byte64.coordinatorlayoutexample.ScollingActivity"
 tools:showIn="@layout/activity_scolling">

 <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/text_margin"
    android:text="@string/large_text" />

 </android.support.v4.widget.NestedScrollView>

이것이 제공하는 것은 툴바를 축소하고 FloatingActionButton을 숨기기 위해 스크롤 할 수있는 레이아웃입니다.

열다:

여기에 이미지 설명 입력

닫은:

여기에 이미지 설명 입력


참고할 추가 사항입니다. OP가 특별히 요청한 이후

또한 FloatingActionButton, SnackBar, AppBarLayout 등과 같은 많은 지원 디자인 라이브러리 클래스는 CoordinatorLayout 내에서 사용될 때 다르게 작동합니다.

And I guess it is because of this.

CoordinatorLayout is a super-powered FrameLayout.

FAB Button, SnackBar works on the concept of FrameLayout, and since CoordinatorLayout itself has functionality of FrameLayout, it might make other views to behave differently!.


CoordinatorLayout is essentially the frame layout with lot of capabilities which is obvious from the name, it automates the coordination among its children and helps build beautiful views. Its implementation can be seen in Google Play Store App.How the toolbar collapses and changes colors.

The best thing about CoordinatorLayoutis the behavior we give to its direct or indirect descendants. You must have seen while scrolling all the UI gets into motion. Its highly likely the behavior is working its magic.


To give a quick snap-shot of what's useful in the Android Documentation :

Use CoordinatorLayout to simply control the relational behavior of your views ,

For instance if you want your ToolBar to collapse or hide. Google made it really easy by introducing AppBarLayout & CollapsingToolbarLayout, which both work best under a CoordinatorLayout.

The other most-used situation is when you want a FloatingActionButton to stick to the bottom of your CollapsingToolbar and move around with it, putting them under a coordinatorLayout and use app:layout_anchor="@id/YourAppBarId" for the glue(!) and app:layout_anchorGravity="bottom|end" as position will be enough for you to see the magic work!

By using this layout as a context , the child views will have better collaboration and behave in an intelligent way because they will be aware of each other through the CoordinatorLayout context , this means your FloatingAction Buttons will no longer get overlapped by a snackBar etc.

these were just a quick summary of most useful parts , so if you want to save more time in animating your app it will be worth it to have little deeper dive in the subject.

see the Google Scrolling view activity template


One thing that is important to note is that CoordinatorLayout doesn’t have any innate understanding of a FloatingActionButton or AppBarLayout work - it just provides an additional API in the form of a Coordinator.Behavior, which allows child views to better control touch events and gestures as well as declare dependencies between each other and receive callbacks via onDependentViewChanged().

Views can declare a default Behavior by using the CoordinatorLayout.DefaultBehavior(YourView.Behavior.class) annotation,or set it in your layout files by with the app:layout_behavior="com.example.app.YourView$Behavior" attribute. This framework makes it possible for any view to integrate with CoordinatorLayout.

Available now! The Design library is available now, so make sure to update the Android Support Repository in the SDK Manager. You can then start using the Design library with a single new dependency:

compile 'com.android.support:design:22.2.0' Note that as the Design library depends on the Support v4 and AppCompat Support Libraries, those will be included automatically when you add the Design library dependency. We also took care that these new widgets are usable in the Android Studio Layout Editor’s Design view (find them under CustomView), giving you an easier way to preview some of these new components.

The Design library, AppCompat, and all of the Android Support Library are important tools in providing the building blocks needed to build a modern, great looking Android app without building everything from scratch.

참고 URL : https://stackoverflow.com/questions/30536749/what-is-coordinatorlayout

반응형