MVC , MVP , MVVM

MVC, MVP , MVVM 모델을 잘 설명하는 코드인것 같다

 

https://github.com/ericmaxwell2003/ticTacToe

ericmaxwell2003/ticTacToe

 

실제로 git를 보면 mvvm , mvp , mvc 로 branch가 나눠져 있어 같은 코드를 

각 패턴별로 어떻게 변경되는지 확인 할 수 있다.

 

 

 

 

MVC

[MVC]

코드 구성이 간단하게 되어있다. controller에 기능이 몰빵되어 있다.

프로그램의 복잡도가 올라가면 controller 코드의 길이가 점점 커지게 된다.

그로 인해서 유지보수도 힘들어 지게 됩니다.

간단한 구조의 앱이라면 MVC패턴으로 작성하는게 직관적이고 작업공수가 적게 듭니다.

 

 

---

MVP

[MVP]

MVP는 MVC와 역할구조적으로는 크게 다르지 않다.

Model과 View는 거의 동일하다.

Presenter와 Controller 의 차이인데 

Presenter 는 interface로 모듈화 하여 코드의 재활용도를 높였다는것이 MVC 와 MVP의 큰 차이점이다.

단점은 MVC와 유사한 만큼 프로그램 복잡도가 올라가면 Presenter의 코드량이 커지는것이 역시 문제 점이다.

 

 

---

 

MVVM

[MVVM]

MVVM의 경우 안드로이드의 데이터 바인딩을 이용해서 뷰와 뷰모델을 연결하기 때문에 코드량이 줄어드고

모듈화 하기 좋아진다는 장점이 있습니다.

단점으로는 프로그램이 커지면 코드복잡도가 앞의 MVC,MVP 보다 더 올라가고

 

아래의 코드처럼 view 역활을 하는 layout의 xml파일이

데이터 바인딩으로 인해서 가독성이 많이 떨어지게 될 수 있습니다.

 

[MVVM xml 코드]

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <data>
        <import type="android.view.View" />
        <variable name="viewModel" type="com.acme.tictactoe.viewmodel.TicTacToeViewModel" />
    </data>

    <LinearLayout
        android:id="@+id/tictactoe"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_horizontal"
        android:orientation="vertical"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin"
        tools:context="com.acme.tictactoe.view.TicTacToeActivity">

        <GridLayout
            android:id="@+id/buttonGrid"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:columnCount="3"
            android:rowCount="3">

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(0,0)}"
                android:text='@{viewModel.cells["00"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(0,1)}"
                android:text='@{viewModel.cells["01"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(0,2)}"
                android:text='@{viewModel.cells["02"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(1,0)}"
                android:text='@{viewModel.cells["10"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(1,1)}"
                android:text='@{viewModel.cells["11"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(1,2)}"
                android:text='@{viewModel.cells["12"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(2,0)}"
                android:text='@{viewModel.cells["20"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(2,1)}"
                android:text='@{viewModel.cells["21"]}' />

            <Button
                style="@style/tictactoebutton"
                android:onClick="@{() -> viewModel.onClickedCellAt(2,2)}"
                android:text='@{viewModel.cells["22"]}' />

        </GridLayout>

        <LinearLayout
            android:id="@+id/winnerPlayerViewGroup"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center"
            android:orientation="vertical"
            android:visibility="@{viewModel.winner != null ? View.VISIBLE : View.GONE}"
            tools:visibility="visible">

            <TextView
                android:id="@+id/winnerPlayerLabel"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_margin="20dp"
                android:textSize="40sp"
                android:text="@{viewModel.winner}"
                tools:text="X" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/winner"
                android:textSize="30sp" />

        </LinearLayout>

    </LinearLayout>
</layout>

 

[MVC xml 코드]

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/tictactoe"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:gravity="center_horizontal"
    tools:context="com.acme.tictactoe.controller.TicTacToeActivity">

    <GridLayout
        android:id="@+id/buttonGrid"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:columnCount="3"
        android:rowCount="3">

        <Button
            android:tag="00"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="01"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="02"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="10"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="11"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="12"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="20"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="21"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

        <Button
            android:tag="22"
            android:onClick="onCellClicked"
            style="@style/tictactoebutton"
            />

    </GridLayout>

    <LinearLayout
        android:id="@+id/winnerPlayerViewGroup"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="vertical"
        android:visibility="gone"
        tools:visibility="visible"
        >

        <TextView
            android:id="@+id/winnerPlayerLabel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="40sp"
            android:layout_margin="20dp"
            tools:text="X" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="30sp"
            android:text="@string/winner" />

    </LinearLayout>

</LinearLayout>

 

 

그리고 컴파일 에러에서 데이터 바인딩에 대한 에러 추적이 어려울수도 있습니다. 

 

---

 

 

 

제가 실제 사용하면서 느낀점을 주로 작성하였습니다.

 

저의 경우는 MVP는 실무에서 써본적이 없어서 MVC와 MVVM를 주로 사용하였습니다.

 

해당 내용에 대한 자세한 내용은 아래 참고한 링크를 보시기 바랍니다.

설명이 잘 되어 있습니다.

 

https://academy.realm.io/kr/posts/eric-maxwell-mvc-mvp-and-mvvm-on-android/

안드로이드의 MVC, MVP, MVVM 종합 안내서