python(pip) 다운

https://www.python.org/downloads

Frida 다운

pip install frida frida-tools

다운로드 받고 설치를 확인해 줍니다.

2. AVD, frida-server, fridump3 download

AVD 다운로드

⭐⭐⭐⭐⭐ 에뮬레이터를 다운 받을때는 꼭 plystore 마크가 없는걸로 다운받아야합니다. (마크있으면 root 권한 불가) 처음에 이걸 잘못 받아서 엄청 고생했습니다

ABI 확인

adb shell getprop ro.product.cpu.abi

Android Emulator의 설치와 CPU-ABI 확인해 줍니다.

frida-server 다운로드

https://github.com/frida/frida/releases

frida 버전과 ABI가 일치해야 합니다. (저는 17.5.1 + x86_64)

fridump3 다운로드(클론받기)

https://github.com/PeanutKingPeanut/fridump3

다운로드 후 한 폴더에 다 넣어주는게 편합니답

3. 에뮬 메모리 덤프 환경 만들기

adb를 이용해 frida-server를 에뮬레이터에 복사하기

adb push frida-server-17.5.1-android-x86_64 /data/local/tmp

frida-server 파일 권한 변경/(백)실행

cd /data/local/tmp chmod 777 ./frida-server-17.5.1-android-x86_64 su ./frida-server-17.5.1-android-x86_64 &

실행중 인지 확인

ps -A | grep frida

3. 에뮬 메모리 덤프 환경 만들기

ProcessId 찾기

frida-ps -U

메모리 덤프 실행

python fridump3.py -u -r [pid] -s

결과 확인 -> dump 폴더에 string.txt 파일 확인

+) 취약성 진단(메모리 덤프 내 중요 정보 평문 방지)

비밀번호와 같이 평문으로 나오면 안되는걸 string -> char[] 으로 사용하면 됩니다.

파일구조(Flutter vs Compose)

우선 두 프로젝트 모두 클린 아키텍쳐를 사용했습니다. compose에 경우 hilt, flutter에 경우 getit을 사용해 의존성 주입(DI)를 적용했습니다.

MVI를 비교하는 편이므로 프리젠테이션 계층 위주로 비교하겠습니다.

jetpack Compose - Contract

class HomeContract {

    data class HomeViewState(
        val loadState: LoadState = LoadState.SUCCESS,
        val groupList: List<GroupDummy> = listOf(),
    ): ViewState

    sealed class HomeSideEffect : ViewSideEffect {
        object NaviMembersInviteScreen : HomeSideEffect()
        object NaviAcceptInviteScreen : HomeSideEffect()
        data class NaviGroupDetail(val id : Long) : HomeSideEffect()
    }

    sealed class HomeEvent : ViewEvent {
        object InitHomeScreen : HomeEvent()
        object OnAddGroupInBoxClicked : HomeEvent()
        object OnAddGroupClicked : HomeEvent()
        object OnEnterGroupClicked : HomeEvent()
        object OnPagingGroupList : HomeEvent()
        data class OnGroupListClicked(val id : Long) : HomeEvent()
    }
}

Flutter - Contract

part 'home_state.freezed.dart';

@freezed
abstract class HomeState with _$HomeState {
  const factory HomeState({
    @Default('All') String selectedCategory,
    @Default([]) List<String> categories,
    @Default([]) List<Recipe> dishes,
    @Default([]) List<Recipe> newRecipes,
    @Default('') String name,
  }) = _HomeState;
}
//-----------------------------------------//


part 'home_side_effect.freezed.dart';

@freezed
sealed class HomeSideEffect with _$HomeSideEffect {
  const factory HomeSideEffect.showSnackBar(String message) = ShowSnackBar;
  const factory HomeSideEffect.navigateToDetail(int id) = NavigateToDetail;
}
//-----------------------------------------//

part 'home_intent.freezed.dart';

@freezed
sealed class HomeIntent with _$HomeIntent {
  const factory HomeIntent.onTapSearchField() = OnTapSearchField;
  const factory HomeIntent.onSelectCategory(String category) = onSelectCategory;
  const factory HomeIntent.onTabFavorite(Recipe recipe) = onTapFavorite;

}

Kotlin에서 사용하던 sealed class, data class를 Dart에서는 freezed 패키지를 활용해 동일하게 구현했습니다.

Freezed란?

Dart에서 불변(Immutable) 클래스를 간단하게 생성할 수 있도록 도와주는 코드 생성 라이브러리입니다. copyWith, 등등 메서드가 자동 생성되어 안전하게 상태를 복사하고 관리할 수 있습니다. 또한, when과 map을 통한 패턴 매칭을 지원해 타입 기반 분기 처리가 매우 간편합니다.

jetpack Compose - viewModel

@HiltViewModel
class HomeViewModel @Inject constructor(
    private val groupListReferUsecase: GroupListReferUsecase,
    private val application: Application
) : BaseViewModel<HomeContract.HomeViewState, HomeContract.HomeSideEffect, HomeContract.HomeEvent>(
    HomeContract.HomeViewState()
) {

    override fun handleEvents(event: HomeContract.HomeEvent) {
        when (event) {
            is HomeContract.HomeEvent.InitHomeScreen -> {
                showRefreshGroupList()
            }

            is HomeContract.HomeEvent.OnAddGroupInBoxClicked -> {
                sendEffect(
                   {HomeContract.HomeSideEffect.NaviMembersInviteScreen }
                )
            }

            .......

Flutter - viewModel

HomeViewModel({
    required GetCategoriesUseCase getCategoriesUseCase,
    required GetDishesByCategoryUsecase getDishesByCategoryUsecase,
    required GetNewRecipesUsecase getNewRecipesUsecase,
    required ToggleBookmarkRecipeUsecase toggleBookmarkRecipeUsecase,
  }) : _getCategoriesUseCase = getCategoriesUseCase,
       _getDishesByCategoryUsecase = getDishesByCategoryUsecase,
       _getNewRecipesUsecase = getNewRecipesUsecase,
       _toggleBookmarkRecipeUsecase = toggleBookmarkRecipeUsecase {
    _fetchCategories();
    _fetchNewRecipes();
  }

  HomeState _state = const HomeState(name: '');
  HomeState get state => _state;

  void onAction(HomeIntent intent) async {
    switch (intent) {
      case OnTapSearchField():
        return;
      case onSelectCategory():
        _onSelectedCategory(intent.category);
      case onTapFavorite() :
        _onTapFavorite(intent.recipe);
    }
  }

  ...

event(compose), intent(flutter) 를 vm 에서 받아서 처리합니다. Flutter에서 ChangeNotifier를 사용해 VM을 구현해 상태 변경과 화면 갱신을 구현했습니다.

• 추후에 bloc를 사용한 버전도 포스트 할 예정입니다.

jetpack Compose - Screen(UI)

@Composable
fun HomeScreen(
    navigationMyPage: () -> Unit,
    viewModel: HomeViewModel = hiltViewModel(),
    mainViewModel: MainViewModel = composableActivityViewModel()
) {
    //상태
    val viewState by viewModel.viewState.collectAsState()
    val context = LocalContext.current as Activity

//sideEffect 처리
    LaunchedEffect(key1 = viewModel.effect) {
        viewModel.effect.collect { effect ->
            when (effect) {
                is HomeContract.HomeSideEffect.NaviMembersInviteScreen -> {
                    navigationToMembersInvite()
                }

                is HomeContract.HomeSideEffect.NaviGroupDetail -> {
                    context.startActivity(GroupDetailActivity.newIntent(context, effect.id))
                }

                else -> Unit
            }
        }
    }
    ...
      @Composable
fun GroupListScreen(
    viewModel: HomeViewModel = hiltViewModel(),
    groupList: List<GroupDummy>,
    modifier: Modifier = Modifier
) {

    val lazyListState = rememberLazyListState()
    lazyListState.OnBottomListener(2) {
    // 이벤트 보내기
        viewModel.setEvent(HomeContract.HomeEvent.OnPagingGroupList)
    }

Flutter - Screen(UI)

class HomeRoot extends StatefulWidget {
  const HomeRoot({super.key});

  @override
  State<HomeRoot> createState() => _HomeRootState();
}

class _HomeRootState extends State<HomeRoot> {
  late HomeViewModel viewModel;
  StreamSubscription? eventSubscription;
  @override
  void initState() {
    super.initState();
    viewModel = getIt<HomeViewModel>();

// sideEffect 처리 
    eventSubscription = viewModel.eventStream.listen((event) {
      if (!mounted) return;

      event.when(
        showSnackBar: (message) {
          ScaffoldMessenger.of(context).showSnackBar(
            SnackBar(content: Text(message)),
          );
        },
        navigateToDetail: (id) {
          Navigator.of(context).push(
            MaterialPageRoute(builder: (_) => DetailPage(id: id)),
          );
        },
      );
    });
  }

  @override
  void dispose() {
    eventSubscription?.cancel();
    super.dispose();
  }
  @override
  Widget build(BuildContext context) {
    return ListenableBuilder(
      builder: (context, snapshot) {
        return HomeScreen(
        // 상태 
          state: viewModel.state,
          onIntent: (HomeIntent intent) {
            if (intent is OnTapSearchField) {
              context.push(RoutePaths.search);
              return;
            }
            //event 처리
            viewModel.onAction(intent);
          },
        );
      },
      listenable: viewModel,
    );
  }
}

UI에선 동일하게 State 받고, VM으로 event(intent) 보내고, sideEffect를 구독해서 오면 원하는 행동을 해줍니다.

이 과정에서 Google은 보안을 위해 암호화된 키만 업로드할 수 있도록 하고 있으며,
이를 위해 pepk.jar이라는 전용 도구를 사용하게 된다.
※ 신규 앱은 해당 작업 필요 없습니다.

keystore 폴더 안에 다음과 같은 파일을 위치시켜줍니다:

• 📦 pepk.jar – Google에서 제공하는 개인키 추출 & 암호화 툴
• 🔐 keystore.jks – 예전에 앱 배포에 사용했던 서명 키
• 📄 encryption_public_key.pem – Google에서 제공한 공개키

🔧 실행 명령어

java -jar pepk.jar --keystore=keystore.jks --alias=key0 --output=encrypted_private_key.pem --rsa-aes-encryption --encryption-key-path=encryption_public_key.pem

⚠️ 자바 버전 오류

Error: Unable to export or encrypt the private key
java.security.NoSuchAlgorithmException: Cannot find any provider supporting RSA/NONE/OAEPWithSHA1AndMGF1Padding
        at java.base/javax.crypto.Cipher.getInstance(Cipher.java:573)
        ...
      ```

저는 23버전을 사용중이여서 pepk.jar는 내부적으로 RSA/NONE/OAEPWithSHA1AndMGF1Padding이라는 암호화 알고리즘을 사용하는데 Java 17 이후부터 이 알고리즘은 보안상 이유로 deprecated 처리되었서 오류가 나옵니다.

해결 방법 – Zulu OpenJDK 11 사용

👉 Zulu OpenJDK 11 다운로드

설치한 후, Java 11을 직접 지정해 아래와 같이 실행합니다

& "C:\Program Files\Zulu\zulu-11\bin\java.exe" -jar pepk.jar --keystore=keystore.jks --alias=key0 --output=encrypted_private_key.pem --rsa-aes-encryption --encryption-key-path=encryption_public_key.pem

문제 발생

compose로 프로젝트를 진행하던 중 오버레이로 (작은 팝업 형태에서) 전화 수신 시 띄우는 것은 성공했는데 아무리해도 시스템 전화 전체화면 위에는 안되고 계속 밑에 그려진다..😿 아무래도 compose를 띄우기 위해 activity를 감싸서 실행한게 문제가 되었다. 그래서 xml 형식으로 띄우기로 결정했다.

전화 감지 Service

@AndroidEntryPoint
class StateService : Service() {

    @Inject
    lateinit var telephonyManager: TelephonyManager
    @Inject
    lateinit var ds: DataStoreUtil
    @Inject
    lateinit var getInfoUsecase: GetInfoUsecase

    private val serviceScope = CoroutineScope(Dispatchers.IO + Job())

    //..//
    private val phoneStateListener = object : PhoneStateListener() {
        override fun onCallStateChanged(state: Int, phoneNumber: String?) {
            super.onCallStateChanged(state, phoneNumber)
            when (state) {
                // 전화 수신 감지
                TelephonyManager.CALL_STATE_RINGING -> {
                    showOverlay()
                }

                //전화 종료 감지
                TelephonyManager.CALL_STATE_IDLE -> {
                    removeOverlay()
                }
            }
        }
    }

    override fun onCreate() {
        super.onCreate()
        //권한 확인
        if (ContextCompat.checkSelfPermission(this, Manifest.permission.READ_PHONE_STATE)
            != PackageManager.PERMISSION_GRANTED
        ) {
            return
        }

        //서비스 실행을 알리는 알림
        createNotificationChannel()

        windowManager = getSystemService(Context.WINDOW_SERVICE) as WindowManager
        //전화 감지 리스너
        telephonyManager.listen(phoneStateListener, PhoneStateListener.LISTEN_CALL_STATE)
    }

    //XML 띄우기
    private fun showOverlay(){ 
    val inflater = getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater
        overlayView = inflater.inflate(R.layout.overlay_layout, null)
    //..// 
    }
    private fun createNotificationChannel(){ //..// }

    //종료 시 
    override fun onDestroy() {
        super.onDestroy()
        telephonyManager.listen(phoneStateListener, PhoneStateListener.LISTEN_NONE)
        removeOverlay()
        serviceScope.cancel()
    }

Google 권장 아키텍처는 Android 앱 개발에서 안정성과 확장성을 높이기 위해 권장되는 구조입니다. 이 아키텍처는 앱의 UI(Presentation), 비즈니스 로직(Domain), 그리고 데이터(Data) 처리를 분리하는 것을 핵심으로 합니다. 이를 통해 코드를 더 관리하기 쉽고 테스트 가능하게 만듭니다. Android | 구글 권장 아키텍처

🌟화살표는 데이터 흐름입니다

주요 특징

관심사의 분리 : 각 레이어는 고유한 역확과 책임을 가짐, 서로의 세부 구현에 의존 X (가독성, 유지보수성⬆️) 단방향 데이터 흐름 : 데이터는 한 방향 (UI -> Domain -> Data)으로만 흐름 (상태 관리 편함, 디버깅 쉬움)

UI layer (view, viewModel) 역활

• 데이터 표시 & 업데이트 (데이터 랜더링 & 상태관리)
• 사용자 입력 처리

compose로 인해 상태 관리의 중요성이 증가하는 중 [나o만]MVI 패턴 적용하기

Domain layer (usecase) 역활 - 선택적 사용

• 복잡한 비즈니스 로직이나 재사용되는 비즈니스 로직 캡슐화하여 관리
• 하나의 책임만 가질 수 있도록 책임 분리
• 테스트 용이

Data layer (repository) 역활

• 저장소 : 각기 다른 데이터 소스를 포함
• 로컬 DB (room), remote (retrofit) 등
• 서버,로컬 데이터 변경 사항 관리
• 비즈니스 로직

음.. 그러면 클린 아키텍처와 차이는 뭐지..?

1. 의존성 방향 - 클린 : Data → Domain ← UI
2. Domain layer의 중요성 - 클린 : 필수 계층, 비즈니스 로직과 규칙
3. 간소 (구글) vs 엄격 (클린)

그러면 공통점은 ? 관심사 분리, 단방향 데이터 흐름, 테스트 용이, 등등 많은 부분

저의 느낀 점은 구글 권장 아키텍처는 클린 아키텍처를 간결하고 실용성있게 만든 아키텍처인 느낌이 듭니다!

마무리

저는 보통 Domain에 reporitory interface도 넣어 클린 아키텍처 방식을 자주 사용하고 있습니다 😊

[[0 for _ in range(3)] for _ in range(2)] , [[0]*3]*2 차이를 아시나요?

두 결과물은

[ [0, 0, 0],  
  [0, 0, 0] ] 

로 같습니다. 그런데 중요한 차이점이 있습니다

바로 독립성 여부 입니다!

matrix[0][1] = 1 를 하면
# [[0 for _ in range(3)] for _ in range(2)]
# -> [[0, 1, 0], [0, 0, 0]]

#[[0]*3]*2
# -> [[0, 1, 0], [0, 1, 0]]

추가) [0] * 3는 독립적입니다

숫자(immutable type) 이기 때문에 독립적입니다!

결론

[0] * 3: 각 요소가 숫자(immutable)라서 독립적 [[0] * 3] * 2: 리스트 객체를 복제하므로 독립적이지 않음 (공유) [[0 for _ in range(3)] for _ in range(2)]: 각 행이 새롭게 생성되므로 독립적 ✨

WorkManager는 지속적인 작업에 권장되는 솔루션입니다. 앱이 다시 시작되거나 시스템이 재부팅될 때 작업이 예약된 채로 남아 있으면 그 작업은 유지됩니다. 대부분의 백그라운드 처리는 지속적인 - 작업을 통해 가장 잘 처리되므로 WorkManager는 백그라운드 처리에 권장하는 기본 API입니다. https://developer.android.com/topic/libraries/architecture/workmanager?hl=ko&utm_source=chatgpt.com

WorkManger의 주요 특징으로는 앱 종료에도 작업을 유지하고, 코루틴을 지원해 비동기 작업을 간단히 구현할 수 있고, Hilt를 통해 필요한 의존성을 주입받아 코드 가독성과 유지보수성을 높일 수 있습니다.

사용한 이유?

나o만 어플 특성상 대규모 사진 업로드/다운로드가 핵심 기능입니다. 게다가 서버의 부하를 줄이기 위해 서버에서 인증된 s3 url를 받고, android 에서 s3 로 직접 사진을 업로드 후, 서버에 작업이 끝났다는 통신을 하는 것이 플로우입니다. 그런데 이 작업을 어플 화면에서 진행시 사용자를 업로드/다운로드 할 때 업로드 되는 것을 그냥 지켜봐야했고, 앱을 강제 종료시키는 행동에 대한 대응이 없어 workManger를 사용한 백그라운드 작업을 하기로 결정했습니다!🙃 (hilt를 통한 주입과 합께)

key point

• CoroutineWorker : 코루틴을 활용해 백그라운드 작업을 간단하고 효율적으로 처리
• Task : 백그라운드 작업 정의
• Enqueuer : viewModel에서 주입하여 백그라운드 작업 실행 task, enqueuer은 코드 예쁘게 할려고(+의존성 주입) 만든 겁니다 (필수X)

1.CoroutineWorker

• doWork() : 백그라운드에서 수행할 작업 구현 (Task 로 주입 받음)
• 백그라운드에서 작업 중을 알리기 위한 NOTIFICATION

@HiltWorker
class ImageUploadWorker @AssistedInject constructor(
    @Assisted appContext: Context,
    @Assisted workerParams: WorkerParameters,
    private val uploadTask: UploadTask
) : CoroutineWorker(appContext, workerParams) {

    private val notificationManager =
        appContext.getSystemService(Context.NOTIFICATION_SERVICE) as NotificationManager

    override suspend fun doWork(): Result {

        val fileUris = inputData.getStringArray(KEY_FILE_URIS) ?: return Result.failure()
        val groupId = inputData.getLong(KEY_GROUP_ID, 0) ?: return  Result.failure()
        showNotification("사진 업로드 중")
        val result = uploadTask.upload(groupId, fileUris.map { Uri.parse(it) }.toTypedArray())

        return result.fold(
            onSuccess = { uploadCount ->
                showNotification("${uploadCount}장 사진 업로드 완료")
                Result.success()
            },
            onFailure = {
                showNotification("사진 업로드 실패")
                Result.failure()
            },
        )
    }

    private fun showNotification(content: String) {
        val notification = NotificationCompat.Builder(applicationContext, "image_channel")
            .setContentTitle("사진 업로드")
            .setContentText(content)
            .setSmallIcon(R.drawable.ic_nangman_23)
            .setPriority(NotificationCompat.PRIORITY_LOW)
            .build()
        notificationManager.notify(NOTIFICATION_ID, notification)
    }

    companion object {
        const val KEY_FILE_URIS = "file-uris"
        const val KEY_GROUP_ID = "group-id"
        const val UNIQUE_UPLOAD_WORK = "upload-work"
        const val NOTIFICATION_ID = 101
    }
}

2.Task

• 실제 백그라운드 작업 (S3로 업로드, 서버에 업로드 결과 알리기)

class UploadTaskImpl @Inject constructor(
    private val s3Util: S3Util,
    private val s3PreSignedUrlUsecase: PhotoPreSignedUrlUsecase,
    private val uploadServerUsecase: PhotoUploadUsecase,
) : UploadTask {
    override suspend fun upload(groupId: Long, uri: Array<Uri>): Result<Int> {

        val result = runCatching {
            var uploadCount = 0
            val successUrl = mutableListOf<String>()

            val dateFormat = SimpleDateFormat("yyyyMMdd_HHmmss", Locale.getDefault())
            val currentTime = dateFormat.format(Date())

            val files = uri.mapIndexed { index, uri ->
                s3Util.convertUriToJpegFile(uri, "${currentTime}_${index}")
            }

            s3PreSignedUrlUsecase(
                PhotoNameListDto(
                    photoNameList = files.map { it.name })
            ).collect { result ->
                result.onSuccess {
                    // s3 업로드 작업~~//
                    }
            }
        return result
    }
}

3. enqueuer

• viewModel 에서 사용하기 바로 위해
• workManger 연결 (기본 설정)

class UploadEnqueuerImpl @Inject constructor(
    private val workManager: WorkManager,
) : UploadEnqueuer {
    override fun enqueueUploadWork(groupId: Long, uris: List<String>) {
        val data = Data.Builder()
            .putStringArray(ImageUploadWorker.KEY_FILE_URIS, uris.toTypedArray())
            .putLong(ImageUploadWorker.KEY_GROUP_ID, groupId)
            .build()
        val request = OneTimeWorkRequestBuilder<ImageUploadWorker>()
            .addTag("upload")
            .setInputData(data)
            .build()
        workManager.enqueueUniqueWork(
            ImageUploadWorker.UNIQUE_UPLOAD_WORK,
            ExistingWorkPolicy.KEEP,
            request,
        )
    }
}

+ Hilt

@Module
@InstallIn(SingletonComponent::class)
abstract class WorkModule {

    @Binds
    @Singleton
    abstract fun bindsUploadTask(uploadTaskImpl: UploadTaskImpl): UploadTask

    @Binds
    @Singleton
    abstract fun bindsUploadEnqueue(uploadEnqueuerImpl: UploadEnqueuerImpl): UploadEnqueuer

    @Binds
    @Singleton
    abstract fun bindsDownloadTask(downloadTaskImpl: DownloadTaskImpl): DownloadTask

    @Binds
    @Singleton
    abstract fun bindsDownloadEnqueue(downloadEnqueuerImpl: DownloadEnqueuerImpl): DownloadEnqueuer
}

viewModel 에서 사용법

@HiltViewModel
class GroupDetailFolderViewModel @Inject constructor(
    private val checkSpecificGroupUsecase: CheckSpecificGroupUsecase,
    private val downloadUserAlbumUsecase: PhotoAllAlbumUsecase,
    private val downloadEtcAlbumUsecase: PhotoNoUsecase,
    private val downloadAllUsecase: PhotoAllUrlUsecase,
    private val uploadEnqueuer: UploadEnqueuer,
    private val downloadEnqueuer: DownloadEnqueuer,
) : BaseViewModel<GroupDetailFolderContract.GroupDetailFolderViewState, GroupDetailFolderContract.GroupDetailFolderSideEffect, GroupDetailFolderContract.GroupDetailFolderEvent>(
    GroupDetailFolderContract.GroupDetailFolderViewState()
) {
  //**//

    private fun uploadUri(uris: List<Uri>) {
        updateState { copy(uris = uris) }
        uploadEnqueuer.enqueueUploadWork(
            viewState.value.groupId,
            viewState.value.uris.map { it.toString() })
    }

  //**//
}

전체 코드: 나o만 GitHub Repository

소감

사진 200장을 업로드하는 데 약 1~2분 정도 걸렸습니다. 이 시간 동안 사용자가 로딩 화면을 지켜보는 대신, 백그라운드에서 작업이 이루어지도록 하여 앱의 다른 활동을 하거나 앱을 종료해도 작업이 계속되도록 했습니다. 이를 통해 사용자 경험이 크게 개선되었습니다. 😇

모델(Model), 뷰(View), 인텐트(Intent)의 세 가지 구성 요소로 이루어져 있습니다.

• Model : 상태 처리 로직, 비지니스 로직
• View : 상태를 바탕으로 사용자 인터페이스 구성, intent를 model로 전달
• Intent : 사용자의 행동(+ 시스템 이벤트) - 상태 변화 트리거

MVI 패턴의 핵심은 단방향 데이터 흐름(Unidirectional Data Flow)

• 사용자의 입력(Intent)이 Model에 전달되어 상태를 변경하고, 변경된 상태는 View를 통해 사용자에게 반영됩니다. 나o만 아키텍쳐 일부

사용한 이유?

• MVVM과 차이 : 상태를 하나로만 관리 -> 여러개의 프로퍼티(liveData, flow)로 관리하지 않아서 가독성 증가, 코드량 감소
• jetpack Compose 사용 : 1.상태 관리 중요성 증가 2.상태를 하나로 관리해서 상태 추적과 업데이트 유리 3.단반향 데이터 흐름이 compose의 (event -> 상태 변경 -> ui 업데이트)와 일치

key point

• State : 여러 상태를 하나로 관리 (view 업데이트에 사용)
• Event : 사용자의 행동을 받아 model로 보냄 (viewModel에서 비지니스 로직, 상태 처리 로직)
• SideEffect : 사용자에게 보여줘야 하는 효과 (view에서 효과 ex-Dialog 보여주기, 화면이동)

예시 :

class VoteMainContract {

    data class VoteMainViewState(
        val loadState: LoadState = LoadState.SUCCESS,
        val groupId: Long = 0L,
        val voteList: List<AgendaDetailInfoModel> = listOf(),
        val voteDetail: AgendaInfoListModel? =null,
        val groupName: String = "",
        val groupNameList : List<ShareGroupNameInfoModel> = listOf()
    ) : ViewState

    sealed class VoteMainSideEffect : ViewSideEffect {
        object NaviAgendaAdd :VoteMainSideEffect()
        object NaviBack : VoteMainSideEffect()
        data class NaviVoteDetail(val agendaId: Long) : VoteMainSideEffect()
    }

    sealed class VoteMainEvent : ViewEvent {
        object InitVoteMainScreen : VoteMainEvent()
        object onAddAgendaInBoxClicked : VoteMainEvent()
        object OnBackClicked :VoteMainEvent()
        object OnPagingVoteList : VoteMainEvent()
        data class OnAgendaItemClicked(val agendaId : Long) :VoteMainEvent()
        data class OnClickDropBoxItem(val member: ShareGroupNameInfoModel) : VoteMainEvent()
    }
}

view에서

• event 보내기
• 상태에 따라 ui 변환
• sideEffect 분기 처리

VoteMainScreen.kt

@Composable
fun VoteMainScreen(
    //**//
) {
    //state 받기
    val viewState by viewModel.viewState.collectAsState()
      //**//

    //sideEffect 받기
    LaunchedEffect(key1 = viewModel.effect) {
        viewModel.effect.collect { effect ->
            when (effect) {
                VoteMainContract.VoteMainSideEffect.NaviAgendaAdd -> {
                    navigationAgenda(viewState.groupId)
                }

                VoteMainContract.VoteMainSideEffect.NaviBack -> {
                    navigationBack()
                }

                is VoteMainContract.VoteMainSideEffect.NaviVoteDetail -> {
                    navigationVoteDetail(effect.agendaId)
                }
            }
        }
    }

    //state 데이토로 ui 분기
    when (viewState.loadState) {
        LoadState.LOADING -> {
            StateLoadingScreen()
        }

    //..//

        viewState.groupNameList.forEachIndexed { _, member ->
                                    androidx.compose.material3.DropdownMenuItem(
                                        text = {
                                            Text(
                                                member.name,
                                                fontSize = 16.sp,
                                                modifier = Modifier.fillMaxWidth()
                                            )
                                        },

                                        //event 보내기
                                        onClick = {
                                            viewModel.setEvent(
                                                VoteMainContract.VoteMainEvent.OnClickDropBoxItem(
                                                    member = member
                                                )
                                            )
     //..//

viewModel에서

• event 분기 처리
• 비지니스 로직
• 상태 업데이트

@HiltViewModel
class VoteMainViewModel @Inject constructor(
    private val agendaInfoListUsecase: AgendaInfoListUsecase,
    private val savedStateHandle: SavedStateHandle,
    private val checkSpecificGroupUsecase: CheckSpecificGroupUsecase,
    private val shareGroupNameListUsecase: ShareGroupNameListUsecase
) : BaseViewModel<VoteMainContract.VoteMainViewState, VoteMainContract.VoteMainSideEffect, VoteMainContract.VoteMainEvent>(
    VoteMainContract.VoteMainViewState()
) {
    //..//

    init {
        updateState { copy(groupId = savedStateHandle[KEY_GROUP_ID] ?: 0L) }
        fetchGroupNameList()
    }

    //event 분기 처리
    override fun handleEvents(event: VoteMainContract.VoteMainEvent) {
        when (event) {
            is VoteMainContract.VoteMainEvent.InitVoteMainScreen -> {
                //비지니스 로직 
                showRefreshVoteList()
            }

            is VoteMainContract.VoteMainEvent.onAddAgendaInBoxClicked -> {
                sendEffect({ VoteMainContract.VoteMainSideEffect.NaviAgendaAdd })
            }

            is VoteMainContract.VoteMainEvent.OnClickDropBoxItem -> {
                //..//
                //상태 업데이트
                updateState {
                    copy(
                        groupId = event.member.shareGroupId,
                        groupName = event.member.name,
                        voteList = listOf()
                    )
                }
                setEvent(VoteMainContract.VoteMainEvent.OnPagingVoteList)
            }
    //..//

코드 더보기 : 나o만 GitHub Repository

소감

MVI 패턴을 적용해서 가독성이 좋아서 코드를 리뷰하기 매우매우매우매우 편하다. 협업하기에 좋은 패턴이라고 생각한다. 😎✌️

What is Beacon ?!

비콘은 주기적으로 신호를 방출하며, 주변에 있는 스마트 디바이스(예: 스마트폰)는 이 신호를 감지하고 해당 비콘의 위치를 파악합니다. 이를 통해 스마트 디바이스는 특정 위치에서 어떤 일을 수행할 수 있게 됩니다.

• https://orbro.io/blog/beacon

장점

정확성 : 비콘은 정확한 위치 정보를 제공하며, 건물 내부와 같이 GPS 신호가 도달하지 않는 환경에서도 작동합니다. 저전력 : 비콘은 저전력 소비로 오랜 배터리 수명을 가지고 있습니다. 간편성 : 비콘을 설정하고 관리하기 쉽습니다.

종류

예시 :

🚨 물론 기본베이스의 종류이고 회사(제조사)마다 다를 수 있습니다~

Android 에서 사용하기 (2가지 방법)

base

<uses-permission android:name="android.permission.BLUETOOTH" />
<uses-permission android:name="android.permission.BLUETOOTH_ADMIN" />
<uses-permission android:name="android.permission.BLUETOOTH_SCAN" />
<uses-permission android:name="android.permission.BLUETOOTH_CONNECT" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

권한을 AndroidManifest.xml에 추가

1. import android.bluetooth.* 사용하기

import android.bluetooth.*
import android.bluetooth.le.*
import android.content.Context
import android.os.ParcelUuid
import android.util.Log

class BluetoothManager(private val context: Context) {

    private var bluetoothAdapter: BluetoothAdapter? = null
    private var bluetoothLeScanner: BluetoothLeScanner? = null
    private var bluetoothGatt: BluetoothGatt? = null
    private val TAG = "BLE"

    private val bleScanCallback = object : ScanCallback() {
        // BLE 스캔 (성공)
        override fun onScanResult(callbackType: Int, result: ScanResult?) {
            super.onScanResult(callbackType, result)
            result?.device?.let { device ->
                connectToDevice(device) // 기기 연결
                bluetoothLeScanner?.stopScan(this)
            }
        }
        // BLE 스캔 (실패)
        override fun onScanFailed(errorCode: Int) {
            Log.e(TAG, "onScanFailed : \${errorCode}")
        }
    }

    //기기 연결 콜백 object
    private val gattCallback = object : BluetoothGattCallback() {
        override fun onConnectionStateChange(gatt: BluetoothGatt, status: Int, newState: Int) {
            if (newState == BluetoothProfile.STATE_CONNECTED) {
                discoverServices(gatt)
            } else if (newState == BluetoothProfile.STATE_DISCONNECTED) {
                Log.d(TAG, "GattCallBack : STATE_DISCONNECTED")
            }
        }

        //BLE 서비스 발견
        override fun onServicesDiscovered(gatt: BluetoothGatt, status: Int) {
            if (status == BluetoothGatt.GATT_SUCCESS) {
                readServices(gatt)
            } else {
                Log.e(TAG, "onServicesDiscovered failed $status")
            }
        }

        //기기 데이터 읽기
        override fun onCharacteristicRead(gatt: BluetoothGatt, characteristic: BluetoothGattCharacteristic, status: Int) {
            if (status == BluetoothGatt.GATT_SUCCESS) {
                val value = characteristic.value
                Log.d(TAG, " UUID: ${characteristic.uuid}, datas: ${value?.joinToString()}")
            } else {
                Log.e(TAG, "onCharacteristicRead failed $status")
            }
        }
    }

    //스캔 시작
    fun startScan() {
        Log.d(TAG, "startScan")
        val bluetoothManager = context.getSystemService(Context.BLUETOOTH_SERVICE) as BluetoothManager
        bluetoothAdapter = bluetoothManager.adapter
        bluetoothLeScanner = bluetoothAdapter?.bluetoothLeScanner

        val scanFilters = listOf(
            ScanFilter.Builder().setServiceUuid(ParcelUuid.fromString("특정 uuid")).build() 

        val scanSettings = ScanSettings.Builder()
            .setScanMode(ScanSettings.SCAN_MODE_LOW_LATENCY)
            .build()

        bluetoothLeScanner?.startScan(scanFilters, scanSettings, bleScanCallback)
    }

    //기기 연결
    private fun connectToDevice(device: BluetoothDevice) {
        bluetoothGatt = device.connectGatt(context, false, gattCallback) //콜백 지정
    }

    // 서비스 검색
    private fun discoverServices(gatt: BluetoothGatt) {
        gatt.discoverServices()
    }

    // 서비스와 특성 읽기
    private fun readServices(gatt: BluetoothGatt) {
        gatt.services?.forEach { service ->
            Log.d(TAG, "service : \${service.uuid}")
            service.characteristics.forEach { characteristic ->
                if (isReadableCharacteristic(characteristic)) {
                    gatt.readCharacteristic(characteristic)
                }
            }
        }
    }

    // 특성이 읽을 수 있는지 확인
    private fun isReadableCharacteristic(characteristic: BluetoothGattCharacteristic): Boolean {
        return characteristic.properties and BluetoothGattCharacteristic.PROPERTY_READ != 0
    }

    // 스캔 그만하기
    fun stopScan() {
        Log.d(TAG, "stopScan")
        bluetoothLeScanner?.stopScan(bleScanCallback)
    }

    // 종료
    fun disconnect() {
        bluetoothGatt?.close()
        bluetoothGatt = null
    }
}

2. org.altbeacon:android-beacon-library 사용하기

AltBeacon 표준을 위한 오픈소스 Android Beacon Librar, 하지만 다른 iBeacon 등 다른 비콘도 감지가 가능하다 BeaconParser 를 추가한다면

• https://github.com/AltBeacon/android-beacon-library

beaconManager.beaconParsers.add(
    BeaconParser()
        .setBeaconLayout("해당 비콘 레이아웃")
)

manifiest.xml - 서비스 추가

<application>
    <!-- Foreground service permission (Android 9 이상) -->
    <service android:name="org.altbeacon.beacon.service.BeaconService" android:foregroundServiceType="location" />
</application>

build.gradle - 라이브러리 추가

dependencies {
    implementation 'org.altbeacon:android-beacon-library:2.19.5'
}

BeaconUtil

import android.content.Context
import android.util.Log
import org.altbeacon.beacon.*

class BeaconUtil(private val context: Context) : BeaconConsumer {

    private val beaconManager: BeaconManager = BeaconManager.getInstanceForApplication(context)

    init {
        // iBeacon 포맷 추가 (비콘 종류 결정)
        beaconManager.beaconParsers.add(BeaconParser().setBeaconLayout(BeaconParser.IBEACON_LAYOUT))
    }

    //바인딩
    fun bind() {
        beaconManager.bind(this)
    }
    //언바인딩
    fun unbind() {
        beaconManager.unbind(this)
    }

    // 비콘 서비스 연결 후 호출되는 콜백 함수
    override fun onBeaconServiceConnect() {
        beaconManager.addRangeNotifier { beacons, region ->
            if (beacons.isNotEmpty()) {
                for (beacon in beacons) {

                    Log.d("BLE", "UUID: \${beacon.id1}, Major: \${beacon.id2}, Minor: \${beacon.id3}")
                    Log.d("BLE", "Distance: \${beacon.distance} meters")
                }
            }
        }

        try {
          // 특정 영역에서 비콘 탐색 시작 (null로 설정 시 모든 비콘 탐색 UUID, Major, Minor)
          beaconManager.startRangingBeaconsInRegion(Region("BeaconUtil", null, null, null))
        } catch (e: RemoteException) {
          e.printStackTrace()
        }
    }
}

org.altbeacon:android-beacon-library 를 사용하면 거리도 구할 수 있다. 👍

비콘 정보 복호화 하기

제조사 by 제조사 이지만 uuid 를 제외하고는 암호화해서 보내는 경우가 종종 있다. 데이터를 확인하려면 복호화가 필요합니다 ⊙.☉

javax.crypto.Cipher 를 사용한 복호화

2-2-1(5)바이트를 복호화 하기

import android.util.Log
import javax.crypto.Cipher
import javax.crypto.spec.SecretKeySpec

object DecryptionUtil {

    private const val TAG = "decrypte"

    fun decrypt(input1: Int, input2: Int, input3: Int): IntArray {

        Log.d(TAG, "input1 = $input1, input2 = $input2, input3 = $input3")

        // 1. 주어진 int 값을 2바이트 배열로 변환
        val inputBytes = ByteArray(5)
        inputBytes[0] = ((input1 shr 8) and 0xFF).toByte()
        inputBytes[1] = (input1 and 0xFF).toByte()
        inputBytes[2] = (input2 and 0xFF).toByte()
        inputBytes[3] = ((input3 shr 8) and 0xFF).toByte()
        inputBytes[4] = (input3 and 0xFF).toByte()

        Log.d(TAG, "복호화 이전 = %02X,%02X,%02X,%02X,%02X".format(inputBytes[0].toInt() and 0xFF, inputBytes[1].toInt() and 0xFF, inputBytes[2].toInt() and 0xFF, inputBytes[3].toInt() and 0xFF, inputBytes[4].toInt() and 0xFF))

        val key = "암호키"
        val rc4Key = SecretKeySpec(key.toByteArray(), "암호화 알고리즘 이름")

        // 3. 암호화 객체 생성 및 초기화
        val rc4Cipher = Cipher.getInstance("")
        rc4Cipher.init(Cipher.DECRYPT_MODE, rc4Key)

        // 4. 복호화 실행
        val decryptedBytes = rc4Cipher.update(inputBytes) 
        Log.d(TAG, "복호화 완료 = %02X,%02X,%02X,%02X,%02X".format(decryptedBytes[0].toInt() and 0xFF, decryptedBytes[1].toInt() and 0xFF, decryptedBytes[2].toInt() and 0xFF, decryptedBytes[3].toInt() and 0xFF, decryptedBytes[4].toInt() and 0xFF))

        // 5. 복호화된 바이트 배열을 각각 2바이트, 2바이트, 1바이트로 변환하여 배열로 반환
        val result1 = (decryptedBytes[0].toInt() and 0xFF shl 8) or (decryptedBytes[1].toInt() and 0xFF)
        val result2 = (decryptedBytes[2].toInt() and 0xFF shl 8) or (decryptedBytes[3].toInt() and 0xFF)
        val result3 = decryptedBytes[4].toInt() and 0xFF

        Log.d(TAG, "(Decryption)result1 = $result1")
        Log.d(TAG, "(Decryption)result2 = $result2")
        Log.d(TAG, "(Decryption)result3 = $result3")

        return intArrayOf(result1, result2, result3)
    }
} 

소감..

회사에서 블루투스(BLE) 통신을 사용한 앱을 제작하기 위해 공부했는데 많은 앱들이 webView로 작업하기 때문에 네이티브 기능을 공부하는 것이 도움이 될거 같다.👻

GitHub과 연동하여 웹 애플리케이션을 빠르게 배포하고 관리할 수 있는 플랫폼

• Git 저장소에 코드를 push하면 CI/CD 파이프라인이 자동으로 트리거되어, 코드가 변경될 때마다 새로운 버전이 자동으로 배포
• Next.js 프로젝트에 최적화된 배포 환경을 제공해, 정적 사이트 생성과 서버리스 기능을 쉽게 구현
• 무료가능 (100GB 대역폭과 월간 1GB 빌드 제한이 있으며, 서버리스 기능은 월간 100개 호출로 제한)
• ⭐️쉽다

NOT_FOUND(404)

토이 프로젝트 중 Vercel을 사용해서 배포했더니 404 에러가 났다... 삽질을 한 결과 매 ~~ 우 간단한 이유였다.

github repo를 import 할 때 Root Directory를 잘못 설정한 문제였다..ㅎㅎㅎㅎ (+Framework Preset 도 Next.js로 설정하세욥)

End

What is SceneView?!

• 3D and AR View for Android, Flutter and React Native working with ARCore and Google Filament

• SceneView are open source projects freely available under the GPL and developed by a dedicated team of passionate individuals.
• ScencView

결론은** ARCore를 쉽게 실행 시키는 라이브러리**입니다

또한, ARCore는 openGL이 필요하다보니 실행되지 않은 기기가 생겨서 SceneView를 사용하기로 결졍했습니다~ 쉽게 구현 가능 하기도하고..ㅎㅎ

AR을 어디에 사용하나요?

ARchive의 핵심 기능인 AR을 통해 타임캡슐을 찾는 기능에 필요하기 때문에 반드시 반드시 구현해야 합니다.. 특이점은 AR의 모델이 3D가 아닌 사용자의 그림에 AI를 적용해 움직이는 스킨(?)을 AR 모델로 사용하기 때문에 이미지(gif)를 캡슐 생성한 gps좌표에 해당하는 위치에 띄우는 것을 목표입니다..⭐️

문제 발생🚨

(2023.10 기준입니다) 최근에 SceneView의 버전이 2.0.0 버전으로 바뀌면서 scencView 공식문서를 업데이트 해주지 않았다.............🫠 그래서 원하는 기능을 구현하기 위해 SceneView깃헙에 있는 예제, closed issue 그리고 거기에 있는 comment들을 샅샅이 뒤져가며 기능을 구현했습니다..여름이였다

지금부터 만약에 2D 사진(gif)을 모델로 AR을 구현해야 하는 분을 위해 글을 쓰겠습니다 ㅎㅎ

SceneView 사용하기

초기 세팅 - sceneView깃헙에에 잘 나와있기 때문에 pass~

.xml

  <io.github.sceneview.ar.ARSceneView
            android:id="@+id/sceneView"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

특정 좌표(GPS)에 AR 모델 생성하기

CameraFragment.kt

// 좌표는 http 통신을 통해 서버에서 가져옵니다.
 visibleLifecycleOwner.lifecycleScope.launch {
            visibleLifecycleOwner.repeatOnLifecycle(Lifecycle.State.STARTED) {
                viewModel.capsuleList.collect { capsuleList ->
                    arSceneView.onSessionUpdated = { session, frame ->
                        if (viewModel.capsuleList.value.isNotEmpty() && !viewModel.isCapsulesAdded) {
                            val earth = session.earth
                            if (earth == null) {
                                Log.d("CameraFragmentAR", "earth is null")
                            } else {
                                if (earth.trackingState == TrackingState.TRACKING) {
                                    capsuleList.forEach { capsule ->
                                        val latitude = capsule.latitude
                                        val longitude = capsule.longitude
                                        val altitude = earth.cameraGeospatialPose.altitude

                                        val earthAnchor = earth.createAnchor(latitude, longitude, altitude, 0f, 0f, 0f, 0f)

                                        addAnchorNode(earthAnchor, capsule)
                                    }
                                }
                            }
                        }

                    }
                }
            }
        }

   // 각 Anchor 별로 Node 구현하는 함수
   private fun addAnchorNode(anchor: Anchor, capsule: CapsuleAnchor) {
        arSceneView.let { sceneView ->
            viewAttachmentManager.let { attachManager ->
                ARContentNode(sceneView, attachManager, this,
                    capsule, layoutInflater, requireContext(),
                    onLoaded = { viewNode ->
                        sceneView.engine.let {
                            AnchorNode(it, anchor).apply {
                                isEditable = true
                                lifecycleScope.launch {
                                    addChildNode(viewNode)
                                }
                                viewModel.addAnchorNode(this)
                                keyMaps[capsule.id] = this
                            }
                        }.let {
                            sceneView.addChildNode(it)
                        }
                    }
                )
            }
        }
    }

✨session.earth.createAnchor( ~~ )를 통해 위치가 고정된 Anchor 를 생성

이미지(gif)를 모델(Node)에 불러오기

ARContentNode.kt

class ARContentNode(
    val arscene: ARSceneView,
    val viewAttManager: ViewAttachmentManager,
    val fragmentManagerProvider: FragmentManagerProvider,
    val capsule: CapsuleAnchor,
    val layoutInflater: LayoutInflater,
    val context: Context,
    val onLoaded: (node: ViewNode) -> Unit
) {

    init {
        renderContent()
    }

    private fun renderContent() {
            //스킨 이미지 추가
        val capsuleSkin = ItemCapsuleSkinBinding.inflate(layoutInflater)

        ViewRenderable.builder()
            .setView(arscene.context, capsuleSkin.root)
            .build(arscene.engine).thenAccept { r: ViewRenderable? ->
                val viewNode = ViewNode(
                    engine = arscene.engine,
                    modelLoader = arscene.modelLoader,
                    viewAttachmentManager = viewAttManager
                ).apply {
                    if (r != null) {
                        setRenderable(r)
                        isEditable = true
                    }
                    onSingleTapConfirmed = {
                        val existingDialog = fragmentManagerProvider.provideFragmentManager()
                            .findFragmentByTag(CapsulePreviewDialogFragment.TAG) as DialogFragment?
                        if (existingDialog == null) {
                            val dialog = CapsulePreviewDialogFragment.newInstance(
                                "-1",
                                capsule.id.toString(),
                                capsule.capsuleType.toString(),
                                true
                            )
                            dialog.show(
                                fragmentManagerProvider.provideFragmentManager(),
                                CapsulePreviewDialogFragment.TAG
                            )
                        }
                        true
                    }
                }
                onLoaded(viewNode)
            }
    }
}

ViewRenderable.builder()을 통해 item_capsule_skin.xml 바인딩하여 이미지(gif) 추가

• onSingleTapConfirmed = { ~ } 으로 Node clickEvent 구현

결과😎

40초 부터 보시면 됩니다, 하하

[ARchive 깃헙 - AR부분] https://github.com/tukcomCD2024/DroidBlossom/tree/master/frontend/ARchive/app/src/main/java/com/droidblossom/archive/presentation/ui/camera

sealed class는 부모 클래스를 상속하는 자식 클래스의 종류를 제한하는 특성을 갖는 클래스.

특징

• 직접 인스턴스화 할 수 없다 , 서브 클래스의 인스턴스화는 가능하다
• 서브 클래스는 data class, object, class가 가능하다
• 같은 파일 내에 선언 되어야 한다

Enum Class 와 비교해보기

*Enum Class *: 타입 안정성을 갖는 상수의 집합을 표현합니다. Enum 클래스를 사용하여 열거형 타입을 정의할 수 있습니다.

서브클래스 정의:

• Sealed Class: 여러 서브클래스를 정의할 수 있으며, 각 서브클래스가 서로 다른 상태와 속성을 가질 수 있습니다.
• Enum Class: 고정된 상수 집합을 정의하며, 서브클래스를 생성할 수 없습니다. 각 상수는 동일한 타입을 가집니다.

  when 구문 사용:

• Sealed Class: 모든 서브클래스를 컴파일 타임에 확인할 수 있어, 처리하지 않은 경우에 대한 경고가 발생합니다. 이는 모든 가능성을 명확히 처리해야 함을 보장합니다. (else 불필요)
• Enum Class: 각 열거형 상수를 사용할 수 있지만, 경우에 따라 새로운 상수를 추가할 수 없으므로, 모든 경우를 처리하는 것이 항상 보장되지 않습니다.(else 필요)

State 관리가 필요한 이유

프로젝트에서 엑티비티에 진입하자고 바로 api 요청 받는 화면에서 api 통신의 결과에 따른 상태관리가 필요했다

• 비로그인 상태
• 로딩 상태
• 요청 실패 상태
• 요청 성공 상태

BrandDetailState.kt

sealed class BrandDetailState {
    object Uninitialized : BrandDetailState()

    object Failure: BrandDetailState()

    object NotAuth: BrandDetailState()

    data class Success(
        val brand: BrandDetail
    ) : BrandDetailState()
}

BrandDetailActivity.kt

//..//
 override fun observeData() {
        viewModel.brandDetailStateLiveData.observe(this) {
            when (it) {
                is BrandDetailState.Uninitialized -> (
                    handleLoading() // 로딩 UI
                }

                is BrandDetailState.Success -> {
                    handleSuccess(it) //성공 했을 시 binding
                }

                is BrandDetailState.Failure -> {
                    handleFailure() // 실패 UI
                }

                is BrandDetailState.NotAuth -> {
                    handleNotAuth() // 로그인 화면으로 이동
                }
            }
        }
//..//

전체적인 흐름은 viewModel에서 의존성 주입 받은 비즈니스 로직(api 통신)의 결과를 LiveData에 넣어 View에서 관찰하여 UI 상태를 번경 한다.

[Neoul 깃헙] https://github.com/UMC-neoul/NEOUL_FRONT/blob/develop/Neoul/app/src/main/java/com/umc/neoul/presentation/main/brand/detail/BrandDetailState.kt

참고

https://velog.io/@kej_ad/Kotlin-Enum-class-와-when문

Koin is a pragmatic and lightweight dependency injection framework for Kotlin developers. (Koin은 Kotlin 개발자를 위한 실용적이고 가벼운 종속성 주입(DI) 프레임워크입니다.) Koin is a DSL, a light container and a pragmatic API (Koin은 DSL이자 가벼운 컨테이너이자 실용적인 API입니다.) - koin 문서

DSL은 특정 도메인에 국한해 사용하는 언어이다. 따라서, koin은 kotlin에 최적화된 DI 라이브러리입니다

의존성 주입(DI)?

객체 간의 의존성을 외부에서 주입해주는 설계 패턴으로 이를 통해 객체가 다른 객체에 직접 의존하지 않고, 필요한 의존성을 외부에서 주입받아 결합도를 낮춥니다. DI는 코드의 유연성, 재사용성, 테스트 용이성을 높이는 데 기여한다.

Noeul 프로젝트에서 DI가 필요한 이유는?

MVVM 패턴을 더욱 잘 이용 + 생명주기와 상관없이 데이터 관리

• MVVM 패턴에서 ViewModel에 필요한 비즈니스 로직을 DI를 통해 주입받음으로써 View와 Model 간의 결합도를 줄이기 위해서
• Singleton 객체를 정의하여 생명주기와 상관없이 상태관리하기 위해서

koin을 사용한 이유

장점

• 러닝커브가 낮아 쉽고 빠르게 DI를 적용할 수 있습니다.
• Kotlin 개발 환경에 도입하기 쉽습니다.
• 별도의 어노테이션을 사용하지 않기 때문에 컴파일 시간이 단축됩니다.
• ViewModel 주입을 쉽게 할 수 있는 별도의 라이브러리를 제공합니다.

단점

• 런타임 시 의존성 주입 -> 런타임 중 에러가 발생할 가능성

선택한 이유는 쉬워서!! + 팀원들은 DI 경험이 없다고 하기도 해서..

그당시 막 안드로이드를 공부하던 시기여서.. 지금은 단점이 치명적이여서 hilt를 더 선호 합니다..ㅎㅎ

neoul의 module

val appModule = module {

    single { Dispatchers.IO }
    single { Dispatchers.Main }

    //network
    single { provideNeoulRetrofit(get(), get()) }
    single { providerGsonConvertFactory() }
    single { buildOkHttpClint() }

    //Api
    single { provideStoryApiService(get()) }
    single { provideBrandApiService(get()) }
    single { provideProductApiService(get()) }

    //loginApi
    single { provideLoginApiService(get()) }

    single<LoginRepository> { DefaultLoginRepository(get(), get()) }


    //SignUpApi
    single { provideSignUpApiService(get()) }

    single<SignupRepository> { DefaultSignupRepository(get(), get()) }

    //MyPageApi
    single { provideMyPageApiService(get()) }
    single<MyPageRepository> { DefaultMyPageRepository(get(), get()) }


    //Repository
    single<StoryRepository> { DefaultStoryRepository(get(), get()) }
    single<BrandRepository> { DefaultBrandRepository(get(), get()) }
    single<ProductRepository> { DefaultProductRepository(get(), get()) }

    //util
    single { ApplicationPreferenceManager(androidApplication()) }
    single { MainMenuBus() }
    single { CategoryMenuBus() }

    //VM
    viewModel { HomeViewModel(get(), get(), get()) }
    viewModel { EventViewModel() }
    viewModel { (categoryId: Int, categoryId2: Int) ->
        CategoryViewModel(get(), categoryId,categoryId2)
    }
    viewModel { BrandViewModel(get()) }
    viewModel { (brand: BrandItem) -> BrandDetailViewModel(brand, get()) }
    viewModel { StoryViewModel(get()) }
    viewModel { (story: Story) -> StoryDetailViewModel(story, get()) }
    viewModel { MyPageViewModel(get()) }
    viewModel { (product: Product) -> ProductViewModel(product, get()) }
    viewModel { SearchViewModel(get() ,get()) }
    viewModel { LikeListViewModel(get(), get()) }

}

Single : 싱글톤 객체로 생성합니다. Factory : 요청 시 마다 매번 새로운 객체를 생성한다. ViewModel : viewModel에 대한 객체를 생성합니다. get : 컴포넌트 내에서 알맞은 의존성을 주입합니다. named("~") : get() 으로 받을때 동일한 타입의 객체를 구분하기 위해

의존성 주입하기

BrandDetailActivity.kt

class BrandDetailActivity : BaseActivity<BrandDetailViewModel, ActivityBrandDetailBinding>() {

    override val viewModel by viewModel<BrandDetailViewModel> {
        parametersOf(
            intent.getParcelableExtra(BRAND_KEY)
        )
    }

    private val mainMenuBus by inject<MainMenuBus>()
    ///****///

BrandDetailViewModel.kt

class BrandDetailViewModel(
    private val brand: BrandItem,
    private val brandRepository: BrandRepository
) : BaseViewModel() {

    private var jwt = ""

    val brandDetailStateLiveData = MutableLiveData<BrandDetailState>(BrandDetailState.Uninitialized)
    val brandLikedLiveData = MutableLiveData<Boolean>(null)
    val productListLiveData = MutableLiveData<List<Product>>()

    override fun fetchData() = viewModelScope.launch {

• viewModel 주입 (+ repository (비지니스 로직))
• 생명주기와 상관없이 상태관리 : main activity의 바텀 내비 값 주입

** brend detail -> main (brend -> my page) , brand detail 엑티비티의 finish 하면서 main 엑티비티의 bottomNavi(fragment) 전환하기 위해 singleton 객체 사용

[Neoul 깃헙] https://github.com/UMC-neoul/NEOUL_FRONT/blob/develop/Neoul/app/src/main/java/com/umc/neoul/di/appModule.kt

이유: PopupMenuItem의 onTap 콜백은 Navigator.pop을 호출하여 팝업을 닫음 -> dialog 도 같이 닫힘

해결: 딜레이를 줘서 해결

 PopupMenuButton(itemBuilder: (context) {
                              return [
                                PopupMenuItem(
                                  child: const Text("리뷰 등록"),
                                  onTap: () {
                                    Future.delayed(
                                        const Duration(seconds: 0),
                                        () => showDialog(
                                              context: context,
                                              builder: (context) {
                                                return AlertDialog(
                                                  title: const Text("리뷰 등록"),
                                                  actions: [
                                                    TextButton(
                                                      onPressed: () =>
                                                          Navigator.of(
                                                                  context)
                                                              .pop(),
                                                      child: const Text("취소"),
                                                    ),
                                                    TextButton(
                                                        onPressed: () {},
                                                        child:
                                                            const Text("등록"))
                                                  ],
                                                  content: Column(
                                                    mainAxisSize:
                                                        MainAxisSize.min,
                                                    children: [
                                                      TextFormField(),
                                                      Row(
                                                        children:
                                                            List.generate(
                                                          5,
                                                          (index) =>
                                                              const Icon(
                                                            Icons.star,
                                                            color:
                                                                Colors.orange,
                                                          ),
                                                        ),
                                                      ),
                                                    ],
                                                  ),
                                                );
                                              },
                                            ));
                                  },
                                ),
                                PopupMenuItem(child: Text("data"))
                              ];
                            }),

참고 : stackoverflow

참고: https://bcp0109.tistory.com/360

code :

 icon = BitmapFactory.decodeResource(resources, R.drawable.baseline_delete_24)       

logcat :

java.lang.NullPointerException: decodeResource(resources…wable.baseline_delete_24) must not be null

해결 : getDrawable 사용

  icon = ContextCompat.getDrawable(requireContext(), R.drawable.baseline_delete_24)?.toBitmap()!!

참고: 링크텍스트

해결: onViewCreated에서 coroutine을 생성하지 말고 onAttach에서 생성한다

override fun onAttach(context: Context) {
        super.onAttach(context)
        CoroutineScope(Dispatchers.Main).launch {
            while (bannerLoop) {
                if (binding.homaBannerViewPager.currentItem == 3) {
                    delay(3000)
                    binding.homaBannerViewPager.currentItem = 0
                    continue

                }
                delay(3000)
                binding.homaBannerViewPager.setCurrentItem(
                    binding.homaBannerViewPager.currentItem,
                    true
                )
                binding.homaBannerViewPager.currentItem += 1
            }
        }
    }

문제 : switchCompat에 track, thumb의 커스텀한 색이 바뀌지 않았다.

해결 방법 : app:trackTint 와 app:thumbTint의 "@null"을 준다.

  <androidx.appcompat.widget.SwitchCompat
        ```  android:layout_marginStart="8dp"
            android:id="@+id/includeSwitch"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="24dp"
            android:thumb="@drawable/switch_thumb_state"
            app:track="@drawable/switch_state"
            app:trackTint="@null"
            app:thumbTint="@null"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toEndOf="@id/includeToggleT"
            app:layout_constraintTop_toTopOf="parent" />