Android - Module 이용하여 비슷한 앱 여러개 찍어내기

1. 새로운 프로젝트를 생성한다. 일단 이름을 RedApp 으로 하겠다.

2. Empty Activity 를 선택하고, 처음 시작할 메인 액티비티의 이름을 RedMainActiity 로 변경해주자. - Finish.

3. 모듈을 추가하기 전에 현재의 모듈 이름이 app 인데, 나중에 만들 blueapp 과 구분하기 위해, 모듈 이름을 redapp 으로 리팩토링 해주겠습니다. app 에 우클릭 - Refactor - Rename -> 'redapp' 입력

4. RedApp과 BlueApp 에서 공통으로 이용할 모듈을 추가하겠습니다. 메뉴 File - New - New Module 클릭 - Android Library 선택. (Android Library 는 자체로는 앱이되지는 않고, Activity 나 Drawable, Layout 같은 여러가지 안드로이드 라이브러리들을 가질 수 있는 모듈입니다.)

5. 공통으로 사용할 안드로이드 리소스 모듈을 'CommonLibrary' 라고 명명하겠습니다. module name을 확인해주세요

6. redapp 의 build.gradle 의 dependencies 에 모듈을 추가합니다.

compile project(':commonlibrary')

그리고 Sync Now 를 눌러주면, 그래들이 돌고 이제부터 redapp 모듈에서 commonlibrary 에 있는 소스들을 이용할 수 있게 됩니다.

7. 이제부터 공동으로 사용할 액티비티 두개를 만들것입니다. 일단 최초 실행될 공통의 Activity인 BaseMainActivity 와, 버튼을 클릭하면 뜨는 SecondActivity 를 만들것입니다. 그리고 레이아웃으로 사용할 activity_base.xml도 만들것입니다. 아래 스크린샷과 같이 commonlibrary 에다 클래스와 레이아웃을 생성하면 되겠습니다.

각 세개의 소스는 아래와 같습니다.

- layout/activity_base.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="버튼"
        android:textSize="30sp"
        android:layout_centerInParent="true"
        android:textStyle="bold"
        />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@id/button"
        android:layout_centerHorizontal="true"
        android:text="버튼 위에 텍스트뷰"
        android:textSize="20sp"
        />
</RelativeLayout>

- BaseMainActivity.java

public class BaseMainActivity extends AppCompatActivity {

    protected Button button;
    protected TextView textView;

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

        setContentView(R.layout.activity_base);

        this.textView = (TextView) findViewById(R.id.textView);

        this.button = (Button) findViewById(R.id.button);
        this.button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent = new Intent(BaseMainActivity.this, SecondActivity.class);
                startActivity(intent);
            }
        });
    }

- SecondActivity.java

public class SecondActivity extends AppCompatActivity {

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_base);

        TextView textView = (TextView) findViewById(R.id.textView);
        textView.setText("세컨드 액티비티입니다");

        Button button = (Button) findViewById(R.id.button);
        button.setText("닫기");
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
    }
}

8. redapp 의 manifests 에다, SecondActivity 를 등록해줍니다.

- redapp / AndroidManifest.xml

<application
    ...
    <activity android:name="com.kokohapps.commonlibrary.SecondActivity"/>
    ...
</application>

9. redapp 의 manifests 를 보면, RedMainActivity 로 시작하게 되어있습니다. 이 RedMainActivity는 BaseMainActivity 를 서브클래싱 해서 사용하도록 하겠습니다. 이러는 이유는, BaseMainActivity 를 공통으로 사용하기도 하면서, RedApp 만의 특징도 함께 사용하기 위해서 입니다. 코드는 아래와 같습니다.

import com.kokohapps.commonlibrary.BaseMainActivity;

public class RedMainMainActivity extends BaseMainActivity {

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

        this.button.setTextColor(ContextCompat.getColor(this, R.color.colorPrimary));
        this.button.setText("레드앱 버튼");
    }
}

BaseMainActivity 를 상속받았으며, 부모의 button의 색상과 문구를 RedApp 답게 변경하였습니다.

 - redapp / res/ values / colors.xml 에서 테마색상도 빨간색으로 변경해줍시다.

10. 이제 redapp을 실행해보면 아래와같습니다. 

11. 이런 단순한 기능의 앱입니다. 이제부터 본격적으로 BlueApp 모듈을 추가하고, 같은 클래스파일을 가지고 같은 기능을 하면서도, 앱마다의 고유한 특징을 추가할 수 있도록 만들어보겠습니다.

  - 일단 현재 실행하는 앱이 어떤 앱인지, 그 앱의 특징은 무엇인지 저장할 프로퍼티를 가진 AppManager 클래스를 만들겠습니다. ( Singleton, Capsulize 따위 귀찮으니 생략... 쿨럭)

 - commonlibrary / AppManager.java

public class AppManager {

    public enum AppType { RedApp, BlueApp }

    public static AppType appType;
    public static int themeColor;

}

12. 이제 BlueApp 모듈을 추가할것입니다. 메뉴 - File - New - New Module - Phone&Tablet Modue - 

앱 이름은 BlueApp 으로 입력합니다.

EmptyActivity 선택하고, BlueMainActivity 로 변경해서 입력해 줍니다. - Finish.

13. BlueApp의 build.gradle 파일의 dependencies 에  commonlibrary 를 추가해줍니다. (위 6번과정과 동일)

compile project(':commonlibrary')

14. BlueApp 의 manifests 에도 SecondActivity 를 등록해줍니다. (위 8번과정과 동일)

15. BlueMainActivity 와, RedMainActivity 을 재정의합니다. AppManager 에 현재 어떤 앱을 실행했는지, 테마색상은 무엇인지 이런것들을 저장해두겠습니다. BaseMainActivity 를 상속받고 있기 때문에, 공통된 기능을 사용할 수 있으며, 오버라이드하면서 그 앱의 특징만 재정의할 수 있겠습니다.

 - RedMainActivity.java

public class RedMainMainActivity extends BaseMainActivity {

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

        AppManager.appType = AppManager.AppType.RedApp;
        AppManager.themeColor = ContextCompat.getColor(this, R.color.colorPrimary);

        this.button.setTextColor(AppManager.themeColor);
        this.button.setText("레드앱 버튼");

        this.textView.setText("이 앱은 레드앱입니다.");
    }
}

 - BlueMainActivity.java

public class BlueMainActivity extends BaseMainActivity {

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

        AppManager.appType = AppManager.AppType.BlueApp;
        AppManager.themeColor = ContextCompat.getColor(this, R.color.colorPrimary);

        this.button.setTextColor(AppManager.themeColor);
        this.button.setText("블루앱 버튼");

        this.textView.setText("블루앱을 실행했군요!!");
    }
}

16. 버튼을 누르면 나오는 SecondActivity도 각 앱의 상황에 맞게 재정의 해봅니다.

public class SecondActivity extends AppCompatActivity {

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_base);

        TextView textView = (TextView) findViewById(R.id.textView);
        Button button = (Button) findViewById(R.id.button);

        //각 앱의 고유 테마색으로 변경.
        textView.setTextColor(AppManager.themeColor);
        button.setTextColor(AppManager.themeColor);

        //앱 타입마다 분기.

        if(AppManager.appType == AppManager.AppType.RedApp) {
            textView.setText("레드앱에서 실행시킨 세컨액티비티");
        }
        else if(AppManager.appType == AppManager.AppType.BlueApp) {
            textView.setText("블루앱에서 실행시킨 세컨액티비티");
        }

        button.setText("닫기");
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
    }
}

17. 두 앱 모두 실행해봅니다. 상단에 앱 모듈을 선택할 수 있습니다.

18. RedApp 실행 모습.

20. BlueApp 실행 모습.

  이런식으로 모듈을 계속해서 추가해 나가면서, 공통된 리소스를 사용하면, 여러개의 비슷한 앱을 계속해서 만들어낼 수 있습니다. 물론 이것은 정말 심플한 예제이고, 실제 Product 를 개발 할 때는, 훨씬 더 많은 고민을 해야할 것입니다. 저는 테마나 색상같은 Resource 관리가 좀 많이 귀찮았습니다. ㅠㅠ 

Full 예제 소스 - https://github.com/vowed21/MultiModuleExample_Andorid