小明非常喜欢网易云，去年刚用 Jetpack Compose 写了个仿网易云 app NCMusic ，最近发现 compose-jb 正式版已经发布到了 v1.3.1， 又玩了一下 Compose Desktop，决定搞了个桌面版的 NCMusicDesktop，数据源还是来自Binaryify大佬的NeteaseCloudMusicApi～

由于以前没有开发桌面应用的经验，索性想按照 Android jetpack 的套路来开发，然而 Navigation、Lifecycle 、ViewModel、LiveData 等等这些在 compose-jb 中，暂时通通没有～ 不要慌，一番查找在掘金上看到一篇文章《推销 Compose 跨平台 Navigation：PreCompose》， 讲了Precompose这个跨平台 Navigation 框架的使用， 它基本复刻了 Jetpack Navigation、Lifecycle、ViewModel 这些组件， 使用方式也基本保持一致，美滋滋！当然 LiveData 已经被废弃了，推荐使用 Flow 代替～至于网络请求，Retrofit 照用不误，又一次美滋滋～

怎么用 Android 老套路来写 Desktop 应用

• 老规矩，先定义一波 BaseResult、BaseViewModel、ViewStateComponent(页面状态切换组件)

  代码： 略
  

• Model 层

  class LyricResult(
    val transUser: LyricContributorBean?,
    val lyricUser: LyricContributorBean?,
    val lrc: LrcBean?,
    val tlyric: LrcBean?
  ) : BaseResult()
  

• ViewModel 层 ``` class CpnLyricViewModel : BaseViewModel() { fun getLyric(id: Long) = launchFlow {

    NCRetrofitClient.getNCApi().getLyric(id)
  

  } }

interface NCApi { @GET("/lyric") suspend fun getLyric(@Query("id") id: Long): LyricResult }

- View 层

@Composable fun CpnLyric() { ViewStateComponent( key = "CpnLyric-${id}", loadDataBlock = {viewModel.getLyric(id)} ) { LyricList(it) } } ```

怎么播放音乐

至于在 Compose Desktop 上怎么播放音乐呢，毕竟没有 Android 的 MediaPlayer，在 github 上找了找，发现succlz123大佬开源的 Compose Multiplatform 项目 AcFun-Client-Multiplatform，里面有视频播放的功能，是基于vlcj来实现的，看了下 vlcj 的 api，使用 AudioPlayerComponent 播放音乐不是问题

关于嵌套滑动

开发过程中，有些交互感觉需要涉及到嵌套滑动，在 Jetpack Compose 中，使用 NestedScrollConnection 来处理嵌套滑动到场景，于是乎，写了一堆✨✨代码后， 发现 NestedScrollConnection 在 Compose Desktop 中完全不起作用，后面找了下 github 的 issue，发现有哥们也遇到了哈哈哈，然而官方 21 年的回复是暂时没有计划， 到现在还是没有解决，凉飕飕～

第三方框架

• PreCompose
• zxing
• compose-imageloader-desktop
• vlcj

运行效果图