opt check reply note

Closes #1095

Signed-off-by: bggRGjQaUbCoE <githubaccount56556@proton.me>

.github/ISSUE_TEMPLATE/bug-反馈.md

@@ -1,23 +0,0 @@
----
-name: Bug 反馈
-about: 描述你所遇到的bug
-title: "[Bug] "
-labels: bug
-assignees: ''
-
----
-
-### 问题描述
-请提供一个清晰而简明的问题描述。
-
-### 复现步骤
-请提供复现该问题所需的具体步骤。
-
-### 预期行为
-请描述你期望的正确行为或结果。
-
-### 错误日志
-请提供设置->关于->错误日志中的内容，粘贴在下方代码框中。如果没有，请提供您的app版本号、系统版本、设备型号等相关信息。
-
-### 相关信息
-请补充截图、录屏、BV号等其他有助于解决问题的信息。

.github/ISSUE_TEMPLATE/bug-反馈.yml

@@ -0,0 +1,58 @@
+name: Bug 反馈
+description: 描述你所遇到的bug
+labels: [ "bug" ]
+title: "[Bug] "
+body:
+
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: 检查清单
+      options:
+        - label: 之前没有人提交过类似或相同的 bug report。
+          required: true
+        - label: 正在使用最新版本。
+          required: true
+
+  - type: textarea
+    id: version
+    attributes:
+      label: 版本号
+    validations:
+      required: true
+
+  - type: textarea
+    id: steps
+    attributes:
+      label: 复现步骤
+      description: 请提供复现该问题所需的具体步骤。
+    validations:
+      required: true
+
+  - type: textarea
+    id: expected
+    attributes:
+      label: 预期行为
+      description: 请描述你期望的正确行为或结果。
+    validations:
+      required: true
+
+  - type: textarea
+    id: actual
+    attributes:
+      label: 实际行为
+      description: 请描述实际的行为或结果。
+    validations:
+      required: true
+
+  - type: textarea
+    id: log
+    attributes:
+      label: 错误日志
+      description: 请提供设置->关于->错误日志中的内容，粘贴在下方代码框中。如果没有，请提供您的app版本号、系统版本、设备型号等相关信息。
+
+  - type: textarea
+    id: info
+    attributes:
+      label: 相关信息
+      description: 请补充截图、录屏、BV号等其他有助于解决问题的信息。

.github/ISSUE_TEMPLATE/功能请求.md

@@ -1,20 +0,0 @@
----
-name: 功能请求
-about: 对于功能的一些建议
-title: "[FR] "
-labels: enhancement
-assignees: ''
-
----
-
-### 功能描述
-请提供对所请求功能的清晰描述。
-
-### 目标
-请描述你希望通过这个功能实现的目标。
-
-### 解决方案
-如果你有任何关于如何实现这个功能的想法或建议，请在这里提供。
-
-### 其他
-请提供已实现该功能或类似功能的应用

.github/ISSUE_TEMPLATE/功能请求.yml

@@ -0,0 +1,35 @@
+name: 功能请求
+description: 对于功能的一些建议
+labels: [ "enhancement" ]
+title: "[FR] "
+body:
+
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: 检查清单
+      options:
+        - label: 之前没有人提交过类似或相同的功能请求。
+          required: true
+        - label: 正在使用最新版本。
+          required: true
+
+  - type: textarea
+    id: desc
+    attributes:
+      label: 功能描述
+      description: 请提供对所请求功能的清晰描述。
+    validations:
+      required: true
+
+  - type: textarea
+    id: solution
+    attributes:
+      label: 解决方案
+      description: 如果你有任何关于如何实现这个功能的想法或建议，请在这里提供。
+
+  - type: textarea
+    id: addition
+    attributes:
+      label: 其他
+      description: 请提供已实现该功能或类似功能的应用

.github/workflows/android.yml

@@ -1,6 +1,14 @@
 name: Android Release
 
 on:
+  pull_request:
+        types:
+          - opened
+          - synchronize
+          - reopened
+          - ready_for_review
+        paths-ignore:
+          - '**.md'
   workflow_dispatch:
 
 jobs:
@@ -33,19 +41,6 @@ jobs:
           channel: stable
           flutter-version-file: pubspec.yaml
 
-      - name: 修复3.24的stable显示中文不正确问题 // from orz12
-        run: |
-            version=$(grep -m 1 'flutter:' pubspec.yaml | awk '{print $2}')
-            if [ "$(echo "$version < 3.27.0" | awk '{print ($1 < $2)}')" -eq 1 ]; then
-              cd $FLUTTER_ROOT
-              git config --global user.name "orz12"
-              git config --global user.email "orz12@test.com"
-              git cherry-pick d4124bd --strategy-option theirs
-              # flutter precache
-              flutter --version
-              cd -
-            fi
-
       - name: 下载项目依赖
         run: flutter pub get
 
@@ -55,6 +50,7 @@ jobs:
           sed -i "s/version: .*/version: $version_name-$(git rev-parse --short HEAD)+$(git rev-list --count HEAD)/g" pubspec.yaml
 
       - name: Write key
+        if: github.event_name != 'pull_request'
         run: |
           if [ ! -z "${{ secrets.SIGN_KEYSTORE_BASE64 }}" ]; then
             echo "${{ secrets.SIGN_KEYSTORE_BASE64 }}" | base64 --decode > android/app/key.jks
@@ -89,4 +85,4 @@ jobs:
         with:
           name: app-x86_64
           path: |
-            build/app/outputs/flutter-apk/app-x86_64-release.apk
+            build/app/outputs/flutter-apk/app-x86_64-release.apk

.github/workflows/ios.yml

@@ -1,6 +1,14 @@
 name: Build for iOS
 
 on:
+  pull_request:
+        types:
+          - opened
+          - synchronize
+          - reopened
+          - ready_for_review
+        paths-ignore:
+          - '**.md'
   workflow_dispatch:
     inputs:
       branch:

.gitignore

@@ -135,4 +135,6 @@ app.*.symbols
 !/dev/ci/**/Gemfile.lock
 !.vscode/settings.json
 
-/lib/build_config.dart
+/lib/build_config.dart
+
+devtools_options.yaml

.vscode/settings.json

@@ -2,5 +2,9 @@
     "editor.formatOnSave": true,
     "[dart]": {
         "editor.formatOnType": true
+    },
+    "editor.codeActionsOnSave": {
+        "source.organizeImports": "explicit",
+        // "source.fixAll": "explicit",
     }
 }

README.md

@@ -47,12 +47,34 @@
 
 ## feat
 
+- [x] 播放课堂视频
+- [x] 发起投票
+- [x] 发布动态/评论支持`富文本编辑`/`表情显示`/`@用户`
+- [x] 修改消息设置
+- [x] 修改聊天设置
+- [x] 展示折叠消息
+- [x] 查看用户图文
+- [x] 动态话题
+- [x] 直播分区
+- [x] 分享`视频`/`番剧`/`动态`/`专栏`/`直播`至消息
+- [x] 创建/修改/删除关注分组
+- [x] 移除粉丝
+- [x] 直播弹幕发送表情
+- [x] 收藏夹排序
+- [x] 稍后再看 ~~`未看`~~ / `未看完` / ~~`已看完`~~ 分类
+- [x] WebDAV 备份/恢复设置
+- [x] 保存评论/动态
+- [x] 高级弹幕 by [@My-Responsitories](https://github.com/My-Responsitories)
+- [x] 取消/置顶评论
+- [x] 记笔记
+- [x] 多账号支持 by [@My-Responsitories](https://github.com/My-Responsitories)
+- [x] 屏蔽带货动态/评论
 - [x] 互动视频
-- [x] 发评反诈
+- [x] 发评/动态反诈
 - [x] 高能进度条
 - [x] 滑动跳转预览视频缩略图
 - [x] Live Photo
-- [x] 复制/移动收藏夹/稍后再看视频
+- [x] 复制/移动/排序收藏夹/稍后再看视频
 - [x] 超分辨率
 - [x] 合并弹幕
 - [x] 会员彩色弹幕
@@ -70,7 +92,6 @@
 - [x] 评论楼中楼定位点击查看的评论
 - [x] 评论楼中楼按热度/时间排序
 - [x] 评论点踩
-- [x] 显示ops专栏
 - [x] 私信发图
 - [x] 投币动画
 - [x] 取消/追番，更新追番状态
@@ -84,9 +105,9 @@
 - [x] 筛选搜索
 - [x] 转发动态
 - [x] 合集图片
-- [x] 删除/置顶私信
+- [x] 删除/置顶/撤回私信
 - [x] 举报用户/评论/视频/动态
-- [x] 删除/发布文本/图片动态
+- [x] 删除/发布/置顶文本/图片动态
 - [x] 其他
 
 ## opt
@@ -155,7 +176,6 @@
   - [x] 音质选择（视视频而定）
   - [x] 解码格式选择（视视频而定）
   - [x] 弹幕
-  - [ ] 直播弹幕
   - [x] 字幕
   - [x] 记忆播放
   - [x] 视频比例：高度/宽度适应、填充、包含等

analysis_options.yaml

@@ -9,6 +9,14 @@
 # packages, and plugins designed to encourage good coding practices.
 include: package:flutter_lints/flutter.yaml
 
+analyzer:
+  exclude:
+    - lib/grpc/bilibili/**
+    - lib/grpc/google/**
+
+formatter:
+  trailing_commas: preserve
+
 linter:
   # The lint rules applied to this project can be customized in the
   # section below to disable rules from the `package:flutter_lints/flutter.yaml`
@@ -21,9 +29,37 @@ linter:
   # or a specific dart file by using the `// ignore: name_of_lint` and
   # `// ignore_for_file: name_of_lint` syntax on the line or in the file
   # producing the lint.
+  # https://dart.dev/tools/linter-rules
   rules:
     # avoid_print: false  # Uncomment to disable the `avoid_print` rule
     # prefer_single_quotes: true  # Uncomment to enable the `prefer_single_quotes` rule
-
+    # - always_specify_types
+    # - avoid_positional_boolean_parameters
+    - always_declare_return_types
+    - always_use_package_imports
+    - avoid_empty_else
+    - avoid_field_initializers_in_const_classes
+    - avoid_print
+    - avoid_relative_lib_imports
+    - avoid_shadowing_type_parameters
+    - avoid_single_cascade_in_expression_statements
+    - avoid_slow_async_io
+    - avoid_type_to_string
+    - avoid_types_as_parameter_names
+    - avoid_unnecessary_containers
+    - avoid_void_async
+    - await_only_futures
+    - camel_case_extensions
+    - camel_case_types
+    - cancel_subscriptions
+    - cascade_invocations
+    - prefer_const_constructors
+    - prefer_const_declarations
+    - sized_box_for_whitespace
+    - unnecessary_late
+    - use_colored_box
+    - use_decorated_box
+    - use_named_constants
+    - use_null_aware_elements
 # Additional information about this file can be found at
 # https://dart.dev/guides/language/analysis-options

android/app/.gitignore

@@ -0,0 +1,2 @@
+/.cxx
+/build

android/app/build.gradle

@@ -1,106 +0,0 @@
-plugins {
-    id "com.android.application"
-    id "kotlin-android"
-    id "dev.flutter.flutter-gradle-plugin"
-}
-
-def localProperties = new Properties()
-def localPropertiesFile = rootProject.file('local.properties')
-if (localPropertiesFile.exists()) {
-    localPropertiesFile.withReader('UTF-8') { reader ->
-        localProperties.load(reader)
-    }
-}
-
-def flutterVersionCode = localProperties.getProperty('flutter.versionCode')
-if (flutterVersionCode == null) {
-    flutterVersionCode = '1'
-}
-
-def flutterVersionName = localProperties.getProperty('flutter.versionName')
-if (flutterVersionName == null) {
-    flutterVersionName = '1.0'
-}
-
-def keystorePropertiesFile = rootProject.file('key.properties')
-def keystoreProperties = new Properties()
-if (keystorePropertiesFile.exists()) {
-    keystoreProperties.load(new FileInputStream(keystorePropertiesFile))
-}
-
-def _filePath = System.getenv("KEYSTORE") ?: keystoreProperties["storeFile"]
-def _storeFile = _filePath != null ? file(_filePath) : null
-def _storePassword = System.getenv("KEYSTORE_PASSWORD") ?: keystoreProperties["storePassword"]
-def _keyAlias = System.getenv("KEY_ALIAS") ?: keystoreProperties["keyAlias"]
-def _keyPassword = System.getenv("KEY_PASSWORD") ?: keystoreProperties["keyPassword"]
-
-android {
-    compileSdkVersion flutter.compileSdkVersion
-
-    namespace 'com.example.piliplus'
-    ndkVersion flutter.ndkVersion
-
-    compileOptions {
-        sourceCompatibility JavaVersion.VERSION_1_8
-        targetCompatibility JavaVersion.VERSION_1_8
-    }
-
-    kotlinOptions {
-        jvmTarget = '1.8'
-    }
-
-    sourceSets {
-        main.java.srcDirs += 'src/main/kotlin'
-    }
-
-    defaultConfig {
-        // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
-        applicationId "com.example.piliplus"
-        // You can update the following values to match your application needs.
-        // For more information, see: https://docs.flutter.dev/deployment/android#reviewing-the-gradle-build-configuration.
-        targetSdkVersion flutter.targetSdkVersion
-        versionCode flutterVersionCode.toInteger()
-        versionName flutterVersionName
-        minSdkVersion flutter.minSdkVersion
-        multiDexEnabled true
-    }
-
-    signingConfigs {
-        // 添加签名配置
-        if(_storeFile != null) {
-            release {
-                // 配置密钥库文件的位置、别名、密码等信息
-                storeFile _storeFile
-                storePassword _storePassword
-                keyAlias _keyAlias
-                keyPassword _keyPassword
-                v1SigningEnabled true
-                v2SigningEnabled true
-            }
-        }
-    }
-
-    buildTypes {
-        release {
-            // TODO: Add your own signing config for the release build.
-            // Signing with the debug keys for now, so `flutter run --release` works.
-            signingConfig _storeFile != null ? signingConfigs.release : signingConfigs.debug
-        }
-        debug {
-            applicationIdSuffix ".debug"
-        }
-    }
-
-    project.android.applicationVariants.all { variant ->
-        variant.outputs.each { output ->
-            output.versionCodeOverride = variant.versionCode
-        }
-    }
-}
-
-flutter {
-    source '../..'
-}
-
-dependencies {
-}

android/app/build.gradle.kts

@@ -0,0 +1,78 @@
+import com.android.build.gradle.internal.api.ApkVariantOutputImpl
+import org.jetbrains.kotlin.konan.properties.Properties
+
+plugins {
+    id("com.android.application")
+    id("kotlin-android")
+    // The Flutter Gradle Plugin must be applied after the Android and Kotlin Gradle plugins.
+    id("dev.flutter.flutter-gradle-plugin")
+}
+
+android {
+    namespace = "com.example.piliplus"
+    compileSdk = flutter.compileSdkVersion
+    ndkVersion = flutter.ndkVersion
+
+    compileOptions {
+        sourceCompatibility = JavaVersion.VERSION_17
+        targetCompatibility = JavaVersion.VERSION_17
+    }
+
+    kotlinOptions {
+        jvmTarget = JavaVersion.VERSION_17.toString()
+    }
+
+    defaultConfig {
+        applicationId = "com.example.piliplus"
+//        minSdk = flutter.minSdkVersion
+        minSdkVersion(23)
+        targetSdk = flutter.targetSdkVersion
+        versionCode = flutter.versionCode
+        versionName = flutter.versionName
+    }
+
+    packagingOptions.jniLibs.useLegacyPackaging = true
+
+    val keyProperties = Properties().also {
+        val properties = rootProject.file("key.properties")
+        if (properties.exists())
+            it.load(properties.inputStream())
+    }
+
+    val config = keyProperties.getProperty("storeFile")?.let {
+        signingConfigs.create("release") {
+            storeFile = file(it)
+            storePassword = keyProperties.getProperty("storePassword")
+            keyAlias = keyProperties.getProperty("keyAlias")
+            keyPassword = keyProperties.getProperty("keyPassword")
+            enableV1Signing = true
+            enableV2Signing = true
+        }
+    }
+
+    buildTypes {
+        all {
+            signingConfig = config ?: signingConfigs["debug"]
+        }
+//        release {
+//            proguardFiles(
+//                getDefaultProguardFile("proguard-android-optimize.txt"),
+//                "proguard-rules.pro"
+//            )
+//        }
+        debug {
+            applicationIdSuffix = ".debug"
+        }
+    }
+
+    applicationVariants.all {
+        val variant = this
+        variant.outputs.forEach { output ->
+            (output as ApkVariantOutputImpl).versionCodeOverride = flutter.versionCode
+        }
+    }
+}
+
+flutter {
+    source = "../.."
+}

android/app/proguard-rules.pro

@@ -0,0 +1 @@
+-keep class com.yalantis.ucrop.util.RectUtils { *; }

android/app/src/debug/res/values/string.xml

@@ -0,0 +1,3 @@
+<resources>
+    <string name="app_name">PiliPlus debug</string>
+</resources>

android/app/src/main/AndroidManifest.xml

@@ -36,14 +36,17 @@
     </queries>
 
     <application
-        android:label="PiliPlus"
+        android:label="@string/app_name"
         android:name="${applicationName}"
         android:icon="@mipmap/ic_launcher"
         xmlns:tools="http://schemas.android.com/tools"
-        android:enableOnBackInvokedCallback="true"
+        android:enableOnBackInvokedCallback="false"
         android:allowBackup="false"
         android:fullBackupContent="false"
         tools:replace="android:allowBackup">
+        <meta-data
+            android:name="io.flutter.embedding.android.EnableImpeller"
+            android:value="false" />
         <activity
             android:name=".MainActivity"
             android:exported="true"
@@ -55,6 +58,9 @@
             android:supportsPictureInPicture="true"
             android:resizeableActivity="true"
             >
+
+            <meta-data android:name="flutter_deeplinking_enabled" android:value="false" />
+
             <!-- Specifies an Android theme to apply to this Activity as soon as
                  the Android process has started. This theme is visible to the user
                  while the Flutter UI initializes. After that, this theme continues
@@ -105,9 +111,10 @@
                     android:pathPattern="/readlist" />
                 <data android:host="advertise" android:path="/home" />
                 <data android:host="clip" />
-                <data android:host="search" />
+                <data android:host="search" android:pathPattern=".*" />
                 <data android:host="stardust-search" />
                 <data android:host="music" />
+                <data android:host="cheese" />
                 <data android:host="bangumi"
                     android:pathPattern="/season.*" />
                 <data android:host="bangumi" android:pathPattern="/.*" />
@@ -139,7 +146,6 @@
                 <data android:host="video" />
                 <data android:host="story" />
                 <data android:host="podcast" />
-                <data android:host="search" />
                 <data android:host="main" android:path="/favorite" />
                 <data android:host="pgc" android:path="/theater/match" />
                 <data android:host="pgc" android:path="/theater/square" />
@@ -154,7 +160,6 @@
                 <data android:host="history" />
                 <data android:host="charge" android:path="/rank" />
                 <data android:host="assistant" />
-                <data android:host="assistant" />
                 <data android:host="feedback" />
                 <data android:host="auth" android:path="/launch" />
             </intent-filter>
@@ -172,7 +177,7 @@
         <activity
             android:name="com.yalantis.ucrop.UCropActivity"
             android:screenOrientation="portrait"
-            android:theme="@style/Theme.AppCompat.Light.NoActionBar"/>
+            android:theme="@style/Ucrop.CropTheme"/>
 
         <receiver 
             android:name="com.ryanheise.audioservice.MediaButtonReceiver"

android/app/src/main/kotlin/com/example/PiliPlus/MainActivity.kt

@@ -4,10 +4,13 @@ import io.flutter.embedding.android.FlutterActivity
 import io.flutter.embedding.engine.FlutterEngine
 import io.flutter.plugin.common.MethodChannel
 import com.ryanheise.audioservice.AudioServiceActivity
+import android.content.ComponentName
 import android.content.Intent
 import android.content.res.Configuration
+import android.net.Uri
 import android.os.Build
 import android.os.Bundle
+import android.provider.Settings
 import android.view.WindowManager.LayoutParams
 import kotlin.system.exitProcess
 
@@ -21,6 +24,55 @@ class MainActivity : AudioServiceActivity() {
         methodChannel.setMethodCallHandler { call, result ->
             if (call.method == "back") {
                 back()
+            } else if (call.method == "biliSendCommAntifraud") {
+                try {
+                    val action = call.argument<Int>("action") ?: 0
+                    val oid = call.argument<Number>("oid") ?: 0L
+                    val type = call.argument<Int>("type") ?: 0
+                    val rpid = call.argument<Number>("rpid") ?: 0L
+                    val root = call.argument<Number>("root") ?: 0L
+                    val parent = call.argument<Number>("parent") ?: 0L
+                    val ctime = call.argument<Number>("ctime") ?: 0L
+                    val commentText = call.argument<String>("comment_text") ?: ""
+                    val pictures = call.argument<String?>("pictures")
+                    val sourceId = call.argument<String>("source_id") ?: ""
+                    val uid = call.argument<Number>("uid") ?: 0L
+                    val cookies = call.argument<List<String>>("cookies") ?: emptyList<String>()
+
+                    val intent = Intent().apply {
+                        component = ComponentName("icu.freedomIntrovert.biliSendCommAntifraud", "icu.freedomIntrovert.biliSendCommAntifraud.ByXposedLaunchedActivity")
+                        putExtra("action", action)
+                        putExtra("oid", oid.toLong())
+                        putExtra("type", type)
+                        putExtra("rpid", rpid.toLong())
+                        putExtra("root", root.toLong())
+                        putExtra("parent", parent.toLong())
+                        putExtra("ctime", ctime.toLong())
+                        putExtra("comment_text", commentText)
+                        if(pictures != null)
+                            putExtra("pictures", pictures)
+                        putExtra("source_id", sourceId)
+                        putExtra("uid", uid.toLong())
+                        putStringArrayListExtra("cookies", ArrayList(cookies))
+                    }
+                    startActivity(intent)
+                } catch (e: Exception) {}
+            } else if (call.method == "linkVerifySettings") {
+                try {
+                    val intent = Intent(android.provider.Settings.ACTION_APP_OPEN_BY_DEFAULT_SETTINGS,
+                        Uri.parse("package:" + context.packageName))
+                    context.startActivity(intent)
+                } catch (t: Throwable) {
+                    try {
+                        val intent = Intent("android.intent.action.MAIN", Uri.parse("package:" + context.packageName))
+                        intent.setClassName("com.android.settings", "com.android.settings.applications.InstalledAppOpenByDefaultActivity")
+                        context.startActivity(intent)
+                    } catch (t2: Throwable) {
+                        val intent = Intent(Settings.ACTION_APPLICATION_DETAILS_SETTINGS,
+                            Uri.parse("package:" + context.packageName))
+                        context.startActivity(intent)
+                    }
+                }
             } else {
                 result.notImplemented()
             }

android/app/src/main/res/values-v35/styles.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <style name="Ucrop.CropTheme" parent="Theme.AppCompat.Light.NoActionBar">
+        <item name="android:windowLightStatusBar">true</item>
+        <item name="android:fitsSystemWindows">true</item>
+        <item name="android:windowOptOutEdgeToEdgeEnforcement">true</item>
+    </style>
+</resources>

android/app/src/main/res/values/string.xml

@@ -0,0 +1,3 @@
+<resources>
+    <string name="app_name">PiliPlus</string>
+</resources>

android/app/src/main/res/values/styles.xml

@@ -21,4 +21,6 @@
         <item name="android:windowBackground">?android:colorBackground</item>
         <item name="android:windowLayoutInDisplayCutoutMode" tools:targetApi="o_mr1">shortEdges</item>
     </style>
+
+    <style name="Ucrop.CropTheme" parent="Theme.AppCompat.Light.NoActionBar"/>
 </resources>

android/build.gradle

@@ -1,46 +0,0 @@
-allprojects {
-    repositories {
-        maven { url "https://maven.aliyun.com/repository/google" }
-        maven { url "https://maven.aliyun.com/repository/central" }
-        maven { url "https://maven.aliyun.com/repository/jcenter" }
-        maven { url "https://maven.aliyun.com/repository/public" }
-        maven { url "http://download.flutter.io"
-            allowInsecureProtocol = true
-        }
-        google()
-        mavenCentral()
-        maven { url 'https://jitpack.io' }
-    }
-}
-
-rootProject.buildDir = '../build'
-subprojects {
-    afterEvaluate { project ->
-        if (project.extensions.findByName("android") != null) {
-            Integer pluginCompileSdk = project.android.compileSdk
-            if (pluginCompileSdk != null && pluginCompileSdk < 31) {
-                project.logger.error(
-                    "Warning: Overriding compileSdk version in Flutter plugin: "
-                        + project.name
-                        + " from "
-                        + pluginCompileSdk
-                        + " to 31 (to work around https://issuetracker.google.com/issues/199180389)."
-                        + "\nIf there is not a new version of " + project.name + ", consider filing an issue against "
-                        + project.name
-                        + " to increase their compileSdk to the latest (otherwise try updating to the latest version)."
-                )
-                project.android {
-                    compileSdk 31
-                }
-            }
-        }
-    }
-    project.buildDir = "${rootProject.buildDir}/${project.name}"
-}
-subprojects {
-    project.evaluationDependsOn(':app')
-}
-
-tasks.register("clean", Delete) {
-    delete rootProject.buildDir
-}

android/build.gradle.kts

@@ -0,0 +1,67 @@
+import org.jetbrains.kotlin.gradle.tasks.KotlinCompile
+
+allprojects {
+    repositories {
+        google()
+        mavenCentral()
+    }
+}
+
+val newBuildDir: Directory =
+    rootProject.layout.buildDirectory
+        .dir("../../build")
+        .get()
+rootProject.layout.buildDirectory.value(newBuildDir)
+
+subprojects {
+    val newSubprojectBuildDir: Directory = newBuildDir.dir(project.name)
+    project.layout.buildDirectory.value(newSubprojectBuildDir)
+}
+
+subprojects {
+    afterEvaluate {
+        if (project.extensions.findByName("android") != null) {
+            val androidExtension =
+                project.extensions.getByName("android") as com.android.build.gradle.BaseExtension
+
+            if (androidExtension.namespace == null) {
+                androidExtension.namespace = project.group.toString()
+            }
+
+            androidExtension.compileOptions {
+                sourceCompatibility = JavaVersion.VERSION_17
+                targetCompatibility = JavaVersion.VERSION_17
+            }
+
+            project.tasks.withType<KotlinCompile>().configureEach {
+                kotlinOptions {
+                    jvmTarget = "17"
+                }
+            }
+
+            val pluginCompileSdkStr = androidExtension.compileSdkVersion
+            val pluginCompileSdk = pluginCompileSdkStr
+                ?.removePrefix("android-")
+                ?.toIntOrNull()
+            if (pluginCompileSdk != null && pluginCompileSdk < 31) {
+                project.logger.error(
+                    "Warning: Overriding compileSdk version in Flutter plugin: ${project.name} " +
+                            "from $pluginCompileSdk to 31 (to work around https://issuetracker.google.com/issues/199180389).\n" +
+                            "If there is not a new version of ${project.name}, consider filing an issue against ${project.name} " +
+                            "to increase their compileSdk to the latest (otherwise try updating to the latest version)."
+                )
+                androidExtension.setCompileSdkVersion(31)
+            }
+        }
+
+        project.buildDir = File(rootProject.buildDir, project.name)
+    }
+}
+
+subprojects {
+    project.evaluationDependsOn(":app")
+}
+
+tasks.register<Delete>("clean") {
+    delete(rootProject.layout.buildDirectory)
+}

android/gradle/wrapper/gradle-wrapper.properties

@@ -2,4 +2,4 @@ distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.6.3-all.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-8.12-all.zip

android/settings.gradle

@@ -1,32 +0,0 @@
-pluginManagement {
-    def flutterSdkPath = {
-        def properties = new Properties()
-        file("local.properties").withInputStream { properties.load(it) }
-        def flutterSdkPath = properties.getProperty("flutter.sdk")
-        assert flutterSdkPath != null, "flutter.sdk not set in local.properties"
-        return flutterSdkPath
-    }()
-
-    includeBuild("$flutterSdkPath/packages/flutter_tools/gradle")
-
-    repositories {
-        maven { url "https://maven.aliyun.com/repository/google" }
-        maven { url "https://maven.aliyun.com/repository/central" }
-        maven { url "https://maven.aliyun.com/repository/jcenter" }
-        maven { url "https://maven.aliyun.com/repository/public" }
-        maven { url "http://download.flutter.io"
-            allowInsecureProtocol = true
-        }
-        google()
-        mavenCentral()
-        gradlePluginPortal()
-    }
-}
-
-plugins {
-    id "dev.flutter.flutter-plugin-loader" version "1.0.0"
-    id "com.android.application" version "7.2.0" apply false
-    id "org.jetbrains.kotlin.android" version "1.9.22" apply false
-}
-
-include ":app"

android/settings.gradle.kts

@@ -0,0 +1,26 @@
+pluginManagement {
+    val flutterSdkPath =
+        run {
+            val properties = java.util.Properties()
+            file("local.properties").inputStream().use { properties.load(it) }
+            val flutterSdkPath = properties.getProperty("flutter.sdk")
+            require(flutterSdkPath != null) { "flutter.sdk not set in local.properties" }
+            flutterSdkPath
+        }
+
+    includeBuild("$flutterSdkPath/packages/flutter_tools/gradle")
+
+    repositories {
+        google()
+        mavenCentral()
+        gradlePluginPortal()
+    }
+}
+
+plugins {
+    id("dev.flutter.flutter-plugin-loader") version "1.0.0"
+    id("com.android.application") version "8.9.1" apply false
+    id("org.jetbrains.kotlin.android") version "2.1.0" apply false
+}
+
+include(":app")

ios/Runner/Info.plist

@@ -2,6 +2,8 @@
 <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
 <plist version="1.0">
 	<dict>
+		<key>FlutterDeepLinkingEnabled</key>
+		<false/>
 		<key>CFBundleDevelopmentRegion</key>
 		<string>$(DEVELOPMENT_LANGUAGE)</string>
 		<key>CFBundleDisplayName</key>

lib/common/constants.dart

@@ -1,11 +1,16 @@
+import 'package:PiliPlus/http/constants.dart';
 import 'package:flutter/material.dart';
 
 class StyleString {
   static const double cardSpace = 8;
   static const double safeSpace = 12;
-  static BorderRadius mdRadius = BorderRadius.circular(10);
+  static const BorderRadius mdRadius = BorderRadius.all(imgRadius);
   static const Radius imgRadius = Radius.circular(10);
   static const double aspectRatio = 16 / 10;
+  static const bottomSheetRadius = BorderRadius.only(
+    topLeft: Radius.circular(18),
+    topRight: Radius.circular(18),
+  );
 }
 
 class Constants {
@@ -21,37 +26,56 @@ class Constants {
   static const String traceId =
       '11111111111111111111111111111111:1111111111111111:0:0';
   static const String userAgent =
-      'Mozilla/5.0 BiliDroid/1.46.2 (bbcallen@gmail.com) os/android model/vivo mobi_app/android_hd build/2001100 channel/yingyongbao innerVer/2001100 osVer/14 network/2';
+      'Mozilla/5.0 BiliDroid/2.0.1 (bbcallen@gmail.com) os/android model/android_hd mobi_app/android_hd build/2001100 channel/master innerVer/2001100 osVer/15 network/2';
   static const String statistics =
-      '%7B%22appId%22%3A5%2C%22platform%22%3A3%2C%22version%22%3A%221.46.2%22%2C%22abtest%22%3A%22%22%7D';
-  //Uri.encodeComponent('{"appId": 5,"platform": 3,"version": "1.46.2","abtest": ""}');
+      '{"appId":5,"platform":3,"version":"2.0.1","abtest":""}';
+  // 请求时会自动encodeComponent
 
-  static const urlPattern =
-      r'https?://[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]';
+  // app
+  static const String userAgentApp =
+      'Mozilla/5.0 BiliDroid/8.43.0 (bbcallen@gmail.com) os/android model/android mobi_app/android build/8430300 channel/master innerVer/8430300 osVer/15 network/2';
 
-// 超分辨率滤镜
+  static const String statisticsApp =
+      '{"appId":1,"platform":3,"version":"8.43.0","abtest":""}';
+
+  static const baseHeaders = {
+    'connection': 'keep-alive',
+    'accept-encoding': 'br,gzip',
+    'referer': HttpString.baseUrl,
+    'env': 'prod',
+    'app-key': 'android64',
+    'x-bili-aurora-zone': 'sh001',
+  };
+
+  static final urlRegex = RegExp(
+    r'https?://[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]',
+  );
+
+  static const goodsUrlPrefix = "https://gaoneng.bilibili.com/tetris";
+
+  // 超分辨率滤镜
   static const List<String> mpvAnime4KShaders = [
     'Anime4K_Clamp_Highlights.glsl',
     'Anime4K_Restore_CNN_VL.glsl',
     'Anime4K_Upscale_CNN_x2_VL.glsl',
     'Anime4K_AutoDownscalePre_x2.glsl',
     'Anime4K_AutoDownscalePre_x4.glsl',
-    'Anime4K_Upscale_CNN_x2_M.glsl'
+    'Anime4K_Upscale_CNN_x2_M.glsl',
   ];
 
   // 超分辨率滤镜 (轻量)
-  static const List<String> mpvAnime4KShadersLite = [
+  static const mpvAnime4KShadersLite = [
     'Anime4K_Clamp_Highlights.glsl',
     'Anime4K_Restore_CNN_M.glsl',
     'Anime4K_Restore_CNN_S.glsl',
     'Anime4K_Upscale_CNN_x2_M.glsl',
     'Anime4K_AutoDownscalePre_x2.glsl',
     'Anime4K_AutoDownscalePre_x4.glsl',
-    'Anime4K_Upscale_CNN_x2_S.glsl'
+    'Anime4K_Upscale_CNN_x2_S.glsl',
   ];
 
   //内容来自 https://passport.bilibili.com/web/generic/country/list
-  static const List<Map<String, dynamic>> internationalDialingPrefix = [
+  static List<Map<String, dynamic>> get internationalDialingPrefix => [
     {"id": 1, "cname": "中国大陆", "country_id": "86"},
     {"id": 5, "cname": "中国香港特别行政区", "country_id": "852"},
     {"id": 2, "cname": "中国澳门特别行政区", "country_id": "853"},
@@ -266,6 +290,6 @@ class Constants {
     {"id": 84, "cname": "海地", "country_id": "509"},
     {"id": 83, "cname": "关岛", "country_id": "1671"},
     {"id": 82, "cname": "瓜德罗普岛", "country_id": "590"},
-    {"id": 69, "cname": "菲律宾", "country_id": "63"}
+    {"id": 69, "cname": "菲律宾", "country_id": "63"},
   ];
 }

lib/common/skeleton/dynamic_card.dart

@@ -1,11 +1,14 @@
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
+import 'package:PiliPlus/utils/global_data.dart';
 import 'package:flutter/material.dart';
-import 'skeleton.dart';
 
 class DynamicCardSkeleton extends StatelessWidget {
   const DynamicCardSkeleton({super.key});
 
   @override
   Widget build(BuildContext context) {
+    final ThemeData theme = Theme.of(context);
+    final color = theme.colorScheme.onInverseSurface;
     return Skeleton(
       child: Container(
         padding: const EdgeInsets.only(left: 12, right: 12, top: 12),
@@ -13,7 +16,7 @@ class DynamicCardSkeleton extends StatelessWidget {
           border: Border(
             bottom: BorderSide(
               width: 8,
-              color: Theme.of(context).dividerColor.withOpacity(0.05),
+              color: theme.dividerColor.withValues(alpha: 0.05),
             ),
           ),
         ),
@@ -25,8 +28,8 @@ class DynamicCardSkeleton extends StatelessWidget {
                   width: 40,
                   height: 40,
                   decoration: BoxDecoration(
-                    color: Theme.of(context).colorScheme.onInverseSurface,
-                    borderRadius: BorderRadius.circular(20),
+                    color: color,
+                    borderRadius: const BorderRadius.all(Radius.circular(20)),
                   ),
                 ),
                 const SizedBox(width: 10),
@@ -34,18 +37,18 @@ class DynamicCardSkeleton extends StatelessWidget {
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: [
                     Container(
-                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      color: color,
                       width: 100,
                       height: 13,
                       margin: const EdgeInsets.only(bottom: 5),
                     ),
                     Container(
-                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      color: color,
                       width: 50,
                       height: 11,
                     ),
                   ],
-                )
+                ),
               ],
             ),
             Container(
@@ -55,31 +58,31 @@ class DynamicCardSkeleton extends StatelessWidget {
                 crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
                   Container(
-                    color: Theme.of(context).colorScheme.onInverseSurface,
+                    color: color,
                     width: double.infinity,
                     height: 13,
                     margin: const EdgeInsets.only(bottom: 7),
                   ),
                   Container(
-                    color: Theme.of(context).colorScheme.onInverseSurface,
+                    color: color,
                     width: double.infinity,
                     height: 13,
                     margin: const EdgeInsets.only(bottom: 7),
                   ),
                   Container(
-                    color: Theme.of(context).colorScheme.onInverseSurface,
+                    color: color,
                     width: 300,
                     height: 13,
                     margin: const EdgeInsets.only(bottom: 7),
                   ),
                   Container(
-                    color: Theme.of(context).colorScheme.onInverseSurface,
+                    color: color,
                     width: 250,
                     height: 13,
                     margin: const EdgeInsets.only(bottom: 7),
                   ),
                   Container(
-                    color: Theme.of(context).colorScheme.onInverseSurface,
+                    color: color,
                     width: 100,
                     height: 13,
                     margin: const EdgeInsets.only(bottom: 7),
@@ -87,6 +90,7 @@ class DynamicCardSkeleton extends StatelessWidget {
                 ],
               ),
             ),
+            if (GlobalData().dynamicsWaterfallFlow) const Spacer(),
             Row(
               mainAxisAlignment: MainAxisAlignment.spaceAround,
               children: [
@@ -99,21 +103,20 @@ class DynamicCardSkeleton extends StatelessWidget {
                     ),
                     style: TextButton.styleFrom(
                       padding: const EdgeInsets.fromLTRB(15, 0, 15, 0),
-                      foregroundColor: Theme.of(context)
-                          .colorScheme
-                          .outline
-                          .withOpacity(0.2),
+                      foregroundColor: theme.colorScheme.outline.withValues(
+                        alpha: 0.2,
+                      ),
                     ),
                     label: Text(
                       i == 0
                           ? '转发'
                           : i == 1
-                              ? '评论'
-                              : '点赞',
+                          ? '评论'
+                          : '点赞',
                     ),
-                  )
+                  ),
               ],
-            )
+            ),
           ],
         ),
       ),

lib/common/skeleton/fav_pgc_item.dart

@@ -0,0 +1,66 @@
+import 'package:PiliPlus/common/constants.dart';
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
+import 'package:flutter/material.dart';
+
+class FavPgcItemSkeleton extends StatelessWidget {
+  const FavPgcItemSkeleton({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final color = Theme.of(context).colorScheme.onInverseSurface;
+    return Skeleton(
+      child: Padding(
+        padding: const EdgeInsets.symmetric(
+          horizontal: StyleString.safeSpace,
+          vertical: 5,
+        ),
+        child: Row(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            AspectRatio(
+              aspectRatio: 3 / 4,
+              child: LayoutBuilder(
+                builder: (context, boxConstraints) {
+                  return Container(
+                    decoration: BoxDecoration(
+                      color: color,
+                      borderRadius: const BorderRadius.all(Radius.circular(4)),
+                    ),
+                    width: boxConstraints.maxWidth,
+                    height: boxConstraints.maxHeight,
+                  );
+                },
+              ),
+            ),
+            const SizedBox(width: 10),
+            Expanded(
+              child: Column(
+                mainAxisSize: MainAxisSize.min,
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  Container(
+                    width: 175,
+                    height: 12,
+                    color: color,
+                  ),
+                  const SizedBox(height: 10),
+                  Container(
+                    width: 55,
+                    height: 11,
+                    color: color,
+                  ),
+                  const SizedBox(height: 5),
+                  Container(
+                    width: 35,
+                    height: 11,
+                    color: color,
+                  ),
+                ],
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/common/skeleton/media_bangumi.dart

@@ -1,31 +1,35 @@
-import 'package:flutter/material.dart';
 import 'package:PiliPlus/common/constants.dart';
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
+import 'package:flutter/material.dart';
 
-import 'skeleton.dart';
-
-class MediaBangumiSkeleton extends StatefulWidget {
-  const MediaBangumiSkeleton({super.key});
+class MediaPgcSkeleton extends StatefulWidget {
+  const MediaPgcSkeleton({super.key});
 
   @override
-  State<MediaBangumiSkeleton> createState() => _MediaBangumiSkeletonState();
+  State<MediaPgcSkeleton> createState() => _MediaPgcSkeletonState();
 }
 
-class _MediaBangumiSkeletonState extends State<MediaBangumiSkeleton> {
+class _MediaPgcSkeletonState extends State<MediaPgcSkeleton> {
   @override
   Widget build(BuildContext context) {
     Color bgColor = Theme.of(context).colorScheme.onInverseSurface;
     return Skeleton(
       child: Padding(
         padding: const EdgeInsets.fromLTRB(
-            StyleString.safeSpace, 7, StyleString.safeSpace, 7),
+          StyleString.safeSpace,
+          7,
+          StyleString.safeSpace,
+          7,
+        ),
         child: Row(
           children: [
             Container(
               width: 111,
               height: 148,
               decoration: BoxDecoration(
-                  borderRadius: const BorderRadius.all(Radius.circular(6)),
-                  color: bgColor),
+                borderRadius: const BorderRadius.all(Radius.circular(6)),
+                color: bgColor,
+              ),
             ),
             const SizedBox(width: 10),
             Expanded(
@@ -35,25 +39,25 @@ class _MediaBangumiSkeletonState extends State<MediaBangumiSkeleton> {
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: [
                     Container(
-                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      color: bgColor,
                       width: 200,
                       height: 20,
                       margin: const EdgeInsets.only(bottom: 15),
                     ),
                     Container(
-                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      color: bgColor,
                       width: 150,
                       height: 13,
                       margin: const EdgeInsets.only(bottom: 5),
                     ),
                     Container(
-                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      color: bgColor,
                       width: 150,
                       height: 13,
                       margin: const EdgeInsets.only(bottom: 5),
                     ),
                     Container(
-                      color: Theme.of(context).colorScheme.onInverseSurface,
+                      color: bgColor,
                       width: 150,
                       height: 13,
                     ),
@@ -62,9 +66,10 @@ class _MediaBangumiSkeletonState extends State<MediaBangumiSkeleton> {
                       width: 90,
                       height: 35,
                       decoration: BoxDecoration(
-                        borderRadius:
-                            const BorderRadius.all(Radius.circular(20)),
-                        color: Theme.of(context).colorScheme.onInverseSurface,
+                        borderRadius: const BorderRadius.all(
+                          Radius.circular(20),
+                        ),
+                        color: bgColor,
                       ),
                     ),
                   ],

lib/common/skeleton/msg_feed_sys_msg_.dart

@@ -0,0 +1,53 @@
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
+import 'package:flutter/material.dart';
+
+class MsgFeedSysMsgSkeleton extends StatelessWidget {
+  const MsgFeedSysMsgSkeleton({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final color = Theme.of(context).colorScheme.onInverseSurface;
+    return Skeleton(
+      child: Padding(
+        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Container(
+              width: 125,
+              height: 16,
+              color: color,
+            ),
+            const SizedBox(height: 6),
+            Container(
+              width: double.infinity,
+              height: 12,
+              color: color,
+            ),
+            const SizedBox(height: 4),
+            Container(
+              width: double.infinity,
+              height: 12,
+              color: color,
+            ),
+            const SizedBox(height: 4),
+            Container(
+              width: 100,
+              height: 12,
+              color: color,
+            ),
+            const SizedBox(height: 4),
+            Align(
+              alignment: Alignment.centerRight,
+              child: Container(
+                width: 100,
+                height: 10,
+                color: color,
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/common/skeleton/msg_feed_top.dart

@@ -0,0 +1,36 @@
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
+import 'package:flutter/material.dart';
+
+class MsgFeedTopSkeleton extends StatelessWidget {
+  const MsgFeedTopSkeleton({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final color = Theme.of(context).colorScheme.onInverseSurface;
+    return Skeleton(
+      child: ListTile(
+        leading: Container(
+          width: 45,
+          height: 45,
+          decoration: BoxDecoration(
+            shape: BoxShape.circle,
+            color: color,
+          ),
+        ),
+        title: UnconstrainedBox(
+          alignment: Alignment.centerLeft,
+          child: Container(
+            width: 100,
+            height: 11,
+            color: color,
+          ),
+        ),
+        subtitle: Container(
+          color: color,
+          width: 125,
+          height: 11,
+        ),
+      ),
+    );
+  }
+}

lib/common/skeleton/skeleton.dart

@@ -10,11 +10,12 @@ class Skeleton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final color = Theme.of(context).colorScheme.surface.withAlpha(10);
     var shimmerGradient = LinearGradient(
       colors: [
         Colors.transparent,
-        Theme.of(context).colorScheme.surface.withAlpha(10),
-        Theme.of(context).colorScheme.surface.withAlpha(10),
+        color,
+        color,
         Colors.transparent,
       ],
       stops: const [
@@ -73,14 +74,14 @@ class ShimmerState extends State<Shimmer> with SingleTickerProviderStateMixin {
   }
 
   LinearGradient get gradient => LinearGradient(
-        colors: widget.linearGradient.colors,
-        stops: widget.linearGradient.stops,
-        begin: widget.linearGradient.begin,
-        end: widget.linearGradient.end,
-        transform: _SlidingGradientTransform(
-          slidePercent: _shimmerController.value,
-        ),
-      );
+    colors: widget.linearGradient.colors,
+    stops: widget.linearGradient.stops,
+    begin: widget.linearGradient.begin,
+    end: widget.linearGradient.end,
+    transform: _SlidingGradientTransform(
+      slidePercent: _shimmerController.value,
+    ),
+  );
 
   bool get isSized =>
       (context.findRenderObject() as RenderBox?)?.hasSize ?? false;
@@ -99,7 +100,7 @@ class ShimmerState extends State<Shimmer> with SingleTickerProviderStateMixin {
 
   @override
   Widget build(BuildContext context) {
-    return widget.child ?? const SizedBox();
+    return widget.child ?? const SizedBox.shrink();
   }
 }
 
@@ -165,7 +166,7 @@ class _ShimmerLoadingState extends State<ShimmerLoading> {
 
     final shimmer = Shimmer.of(context)!;
     if (!shimmer.isSized) {
-      return const SizedBox();
+      return const SizedBox.shrink();
     }
     final shimmerSize = shimmer.size;
     final gradient = shimmer.gradient;

lib/common/skeleton/space_opus.dart

@@ -0,0 +1,51 @@
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
+import 'package:PiliPlus/utils/utils.dart';
+import 'package:flutter/material.dart';
+
+class SpaceOpusSkeleton extends StatelessWidget {
+  const SpaceOpusSkeleton({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final surface = Theme.of(context).colorScheme.onInverseSurface;
+    return Skeleton(
+      child: Card(
+        clipBehavior: Clip.hardEdge,
+        shape: const RoundedRectangleBorder(
+          borderRadius: BorderRadius.all(Radius.circular(6)),
+        ),
+        child: LayoutBuilder(
+          builder: (context, constraints) {
+            return Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Container(
+                  height:
+                      (0.68 + 0.82 * Utils.random.nextDouble()) *
+                      constraints.maxWidth,
+                  color: surface,
+                ),
+                Container(
+                  height: 10,
+                  color: surface,
+                  margin: const EdgeInsets.all(10),
+                  width: constraints.maxWidth * 0.7,
+                ),
+                Container(
+                  height: 10,
+                  color: surface,
+                  margin: const EdgeInsets.only(
+                    left: 10,
+                    right: 10,
+                    bottom: 10,
+                  ),
+                  width: constraints.maxWidth,
+                ),
+              ],
+            );
+          },
+        ),
+      ),
+    );
+  }
+}

lib/common/skeleton/video_card_h.dart

@@ -1,97 +1,79 @@
 import 'package:PiliPlus/common/constants.dart';
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
 import 'package:flutter/material.dart';
-import 'skeleton.dart';
 
 class VideoCardHSkeleton extends StatelessWidget {
   const VideoCardHSkeleton({super.key});
 
   @override
   Widget build(BuildContext context) {
+    final color = Theme.of(context).colorScheme.onInverseSurface;
     return Skeleton(
       child: Padding(
         padding: const EdgeInsets.symmetric(
           horizontal: StyleString.safeSpace,
           vertical: 5,
         ),
-        child: LayoutBuilder(
-          builder: (context, boxConstraints) {
-            double width =
-                (boxConstraints.maxWidth - StyleString.cardSpace * 6) / 2;
-            return SizedBox(
-              height: width / StyleString.aspectRatio,
-              child: Row(
-                mainAxisAlignment: MainAxisAlignment.start,
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  AspectRatio(
-                    aspectRatio: StyleString.aspectRatio,
-                    child: LayoutBuilder(
-                      builder: (context, boxConstraints) {
-                        return Container(
-                          decoration: BoxDecoration(
-                            color:
-                                Theme.of(context).colorScheme.onInverseSurface,
-                            borderRadius: StyleString.mdRadius,
-                          ),
-                        );
-                      },
+        child: Row(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            AspectRatio(
+              aspectRatio: StyleString.aspectRatio,
+              child: LayoutBuilder(
+                builder: (context, boxConstraints) {
+                  return DecoratedBox(
+                    decoration: BoxDecoration(
+                      color: color,
+                      borderRadius: StyleString.mdRadius,
                     ),
-                  ),
-                  // VideoContent(videoItem: videoItem)
-                  Expanded(
-                    child: Padding(
-                      padding: const EdgeInsets.fromLTRB(10, 4, 6, 4),
-                      child: Column(
-                        crossAxisAlignment: CrossAxisAlignment.start,
-                        children: [
-                          Container(
-                            color:
-                                Theme.of(context).colorScheme.onInverseSurface,
-                            width: 200,
-                            height: 11,
-                            margin: const EdgeInsets.only(bottom: 5),
-                          ),
-                          Container(
-                            color:
-                                Theme.of(context).colorScheme.onInverseSurface,
-                            width: 150,
-                            height: 13,
-                          ),
-                          const Spacer(),
-                          Container(
-                            color:
-                                Theme.of(context).colorScheme.onInverseSurface,
-                            width: 100,
-                            height: 13,
-                            margin: const EdgeInsets.only(bottom: 5),
-                          ),
-                          Row(
-                            children: [
-                              Container(
-                                color: Theme.of(context)
-                                    .colorScheme
-                                    .onInverseSurface,
-                                width: 40,
-                                height: 13,
-                                margin: const EdgeInsets.only(right: 8),
-                              ),
-                              Container(
-                                color: Theme.of(context)
-                                    .colorScheme
-                                    .onInverseSurface,
-                                width: 40,
-                                height: 13,
-                              ),
-                            ],
-                          )
-                        ],
-                      ),
-                    ),
-                  ),
-                ],
+                  );
+                },
               ),
-            );
-          },
+            ),
+            Expanded(
+              child: Padding(
+                padding: const EdgeInsets.fromLTRB(10, 4, 6, 4),
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Container(
+                      color: color,
+                      width: 200,
+                      height: 11,
+                      margin: const EdgeInsets.only(bottom: 5),
+                    ),
+                    Container(
+                      color: color,
+                      width: 150,
+                      height: 13,
+                    ),
+                    const Spacer(),
+                    Container(
+                      color: color,
+                      width: 100,
+                      height: 13,
+                      margin: const EdgeInsets.only(bottom: 5),
+                    ),
+                    Row(
+                      children: [
+                        Container(
+                          color: color,
+                          width: 40,
+                          height: 13,
+                          margin: const EdgeInsets.only(right: 8),
+                        ),
+                        Container(
+                          color: color,
+                          width: 40,
+                          height: 13,
+                        ),
+                      ],
+                    ),
+                  ],
+                ),
+              ),
+            ),
+          ],
         ),
       ),
     );

lib/common/skeleton/video_card_v.dart

@@ -1,12 +1,13 @@
 import 'package:PiliPlus/common/constants.dart';
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
 import 'package:flutter/material.dart';
-import 'skeleton.dart';
 
 class VideoCardVSkeleton extends StatelessWidget {
   const VideoCardVSkeleton({super.key});
 
   @override
   Widget build(BuildContext context) {
+    final color = Theme.of(context).colorScheme.onInverseSurface;
     return Skeleton(
       child: Column(
         children: [
@@ -14,9 +15,9 @@ class VideoCardVSkeleton extends StatelessWidget {
             aspectRatio: StyleString.aspectRatio,
             child: LayoutBuilder(
               builder: (context, boxConstraints) {
-                return Container(
+                return DecoratedBox(
                   decoration: BoxDecoration(
-                    color: Theme.of(context).colorScheme.onInverseSurface,
+                    color: color,
                     borderRadius: StyleString.mdRadius,
                   ),
                 );
@@ -37,24 +38,24 @@ class VideoCardVSkeleton extends StatelessWidget {
                   width: 200,
                   height: 13,
                   margin: const EdgeInsets.only(bottom: 5),
-                  color: Theme.of(context).colorScheme.onInverseSurface,
+                  color: color,
                 ),
                 Container(
                   width: 150,
                   height: 13,
                   margin: const EdgeInsets.only(bottom: 12),
-                  color: Theme.of(context).colorScheme.onInverseSurface,
+                  color: color,
                 ),
                 Container(
                   width: 110,
                   height: 13,
                   margin: const EdgeInsets.only(bottom: 5),
-                  color: Theme.of(context).colorScheme.onInverseSurface,
+                  color: color,
                 ),
                 Container(
                   width: 75,
                   height: 13,
-                  color: Theme.of(context).colorScheme.onInverseSurface,
+                  color: color,
                 ),
               ],
             ),

lib/common/skeleton/video_reply.dart

@@ -1,5 +1,5 @@
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
 import 'package:flutter/material.dart';
-import 'skeleton.dart';
 
 class VideoReplySkeleton extends StatelessWidget {
   const VideoReplySkeleton({super.key});
@@ -26,17 +26,20 @@ class VideoReplySkeleton extends StatelessWidget {
                   width: 80,
                   height: 13,
                   color: bgColor,
-                )
+                ),
               ],
             ),
           ),
           Container(
             width: double.infinity,
-            margin:
-                const EdgeInsets.only(top: 4, left: 57, right: 6, bottom: 6),
+            margin: const EdgeInsets.only(
+              top: 4,
+              left: 57,
+              right: 6,
+              bottom: 6,
+            ),
             child: Column(
               crossAxisAlignment: CrossAxisAlignment.start,
-              mainAxisAlignment: MainAxisAlignment.start,
               children: [
                 Container(
                   width: 300,
@@ -72,9 +75,9 @@ class VideoReplySkeleton extends StatelessWidget {
                       margin: const EdgeInsets.only(bottom: 4),
                       color: bgColor,
                     ),
-                    const SizedBox(width: 8)
+                    const SizedBox(width: 8),
                   ],
-                )
+                ),
               ],
             ),
           ),

lib/common/skeleton/whisper_item.dart

@@ -0,0 +1,41 @@
+import 'package:PiliPlus/common/skeleton/skeleton.dart';
+import 'package:flutter/material.dart';
+
+class WhisperItemSkeleton extends StatelessWidget {
+  const WhisperItemSkeleton({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final color = Theme.of(context).colorScheme.onInverseSurface;
+    return Skeleton(
+      child: ListTile(
+        leading: Container(
+          width: 45,
+          height: 45,
+          decoration: BoxDecoration(
+            shape: BoxShape.circle,
+            color: color,
+          ),
+        ),
+        title: UnconstrainedBox(
+          alignment: Alignment.centerLeft,
+          child: Container(
+            width: 100,
+            height: 11,
+            color: color,
+          ),
+        ),
+        subtitle: Container(
+          color: color,
+          width: 125,
+          height: 11,
+        ),
+        trailing: Container(
+          color: color,
+          width: 50,
+          height: 11,
+        ),
+      ),
+    );
+  }
+}

lib/common/widgets/animated_dialog.dart

@@ -1,74 +0,0 @@
-import 'package:PiliPlus/common/widgets/no_splash_factory.dart';
-import 'package:PiliPlus/common/widgets/overlay_pop.dart';
-import 'package:flutter/material.dart';
-
-class AnimatedDialog extends StatefulWidget {
-  const AnimatedDialog({
-    super.key,
-    required this.videoItem,
-    required this.closeFn,
-  });
-
-  final dynamic videoItem;
-  final Function closeFn;
-
-  @override
-  State<StatefulWidget> createState() => AnimatedDialogState();
-}
-
-class AnimatedDialogState extends State<AnimatedDialog>
-    with SingleTickerProviderStateMixin {
-  late AnimationController controller;
-  late Animation<double> opacityAnimation;
-  late Animation<double> scaleAnimation;
-
-  @override
-  void initState() {
-    super.initState();
-
-    controller = AnimationController(
-        vsync: this, duration: const Duration(milliseconds: 255));
-    opacityAnimation = Tween<double>(begin: 0.0, end: 0.6)
-        .animate(CurvedAnimation(parent: controller, curve: Curves.linear));
-    scaleAnimation = CurvedAnimation(parent: controller, curve: Curves.linear);
-    controller.addListener(() => setState(() {}));
-    controller.forward();
-  }
-
-  @override
-  void dispose() {
-    controller.removeListener(() {});
-    controller.dispose();
-    super.dispose();
-  }
-
-  void closeFn() async {
-    await controller.reverse();
-    widget.closeFn();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Material(
-      color: Colors.black.withOpacity(opacityAnimation.value),
-      child: InkWell(
-        highlightColor: Colors.transparent,
-        splashColor: Colors.transparent,
-        splashFactory: NoSplashFactory(),
-        onTap: closeFn,
-        child: Center(
-          child: FadeTransition(
-            opacity: scaleAnimation,
-            child: ScaleTransition(
-              scale: scaleAnimation,
-              child: OverlayPop(
-                videoItem: widget.videoItem,
-                closeFn: closeFn,
-              ),
-            ),
-          ),
-        ),
-      ),
-    );
-  }
-}

lib/common/widgets/app_expansion_panel_list.dart

@@ -1,351 +0,0 @@
-import 'package:flutter/material.dart';
-
-const double _kPanelHeaderCollapsedHeight = kMinInteractiveDimension;
-
-class _SaltedKey<S, V> extends LocalKey {
-  const _SaltedKey(this.salt, this.value);
-
-  final S salt;
-  final V value;
-
-  @override
-  bool operator ==(Object other) {
-    if (other.runtimeType != runtimeType) return false;
-    return other is _SaltedKey<S, V> &&
-        other.salt == salt &&
-        other.value == value;
-  }
-
-  @override
-  int get hashCode => Object.hash(runtimeType, salt, value);
-
-  @override
-  String toString() {
-    final String saltString = S == String ? "<'$salt'>" : '<$salt>';
-    final String valueString = V == String ? "<'$value'>" : '<$value>';
-    return '[$saltString $valueString]';
-  }
-}
-
-class AppExpansionPanelList extends StatefulWidget {
-  /// Creates an expansion panel list widget. The [expansionCallback] is
-  /// triggered when an expansion panel expand/collapse button is pushed.
-  ///
-  /// The [children] and [animationDuration] arguments must not be null.
-  const AppExpansionPanelList({
-    super.key,
-    required this.children,
-    this.expansionCallback,
-    this.animationDuration = kThemeAnimationDuration,
-    this.expandedHeaderPadding = EdgeInsets.zero,
-    this.dividerColor,
-    this.elevation = 2,
-  })  : _allowOnlyOnePanelOpen = false,
-        initialOpenPanelValue = null;
-
-  /// The children of the expansion panel list. They are laid out in a similar
-  /// fashion to [ListBody].
-  final List<AppExpansionPanel> children;
-
-  /// The callback that gets called whenever one of the expand/collapse buttons
-  /// is pressed. The arguments passed to the callback are the index of the
-  /// pressed panel and whether the panel is currently expanded or not.
-  ///
-  /// If AppExpansionPanelList.radio is used, the callback may be called a
-  /// second time if a different panel was previously open. The arguments
-  /// passed to the second callback are the index of the panel that will close
-  /// and false, marking that it will be closed.
-  ///
-  /// For AppExpansionPanelList, the callback needs to setState when it's notified
-  /// about the closing/opening panel. On the other hand, the callback for
-  /// AppExpansionPanelList.radio is simply meant to inform the parent widget of
-  /// changes, as the radio panels' open/close states are managed internally.
-  ///
-  /// This callback is useful in order to keep track of the expanded/collapsed
-  /// panels in a parent widget that may need to react to these changes.
-  final ExpansionPanelCallback? expansionCallback;
-
-  /// The duration of the expansion animation.
-  final Duration animationDuration;
-
-  // Whether multiple panels can be open simultaneously
-  final bool _allowOnlyOnePanelOpen;
-
-  /// The value of the panel that initially begins open. (This value is
-  /// only used when initializing with the [AppExpansionPanelList.radio]
-  /// constructor.)
-  final Object? initialOpenPanelValue;
-
-  /// The padding that surrounds the panel header when expanded.
-  ///
-  /// By default, 16px of space is added to the header vertically (above and below)
-  /// during expansion.
-  final EdgeInsets expandedHeaderPadding;
-
-  /// Defines color for the divider when [AppExpansionPanel.isExpanded] is false.
-  ///
-  /// If `dividerColor` is null, then [DividerThemeData.color] is used. If that
-  /// is null, then [ThemeData.dividerColor] is used.
-  final Color? dividerColor;
-
-  /// Defines elevation for the [AppExpansionPanel] while it's expanded.
-  ///
-  /// By default, the value of elevation is 2.
-  final double elevation;
-
-  @override
-  State<AppExpansionPanelList> createState() => _AppExpansionPanelListState();
-}
-
-class _AppExpansionPanelListState extends State<AppExpansionPanelList> {
-  ExpansionPanelRadio? _currentOpenPanel;
-
-  @override
-  void initState() {
-    super.initState();
-    if (widget._allowOnlyOnePanelOpen) {
-      assert(_allIdentifiersUnique(),
-          'All ExpansionPanelRadio identifier values must be unique.');
-      if (widget.initialOpenPanelValue != null) {
-        _currentOpenPanel = searchPanelByValue(
-            widget.children.cast<ExpansionPanelRadio>(),
-            widget.initialOpenPanelValue);
-      }
-    }
-  }
-
-  @override
-  void didUpdateWidget(AppExpansionPanelList oldWidget) {
-    super.didUpdateWidget(oldWidget);
-
-    if (widget._allowOnlyOnePanelOpen) {
-      assert(_allIdentifiersUnique(),
-          'All ExpansionPanelRadio identifier values must be unique.');
-      // If the previous widget was non-radio AppExpansionPanelList, initialize the
-      // open panel to widget.initialOpenPanelValue
-      if (!oldWidget._allowOnlyOnePanelOpen) {
-        _currentOpenPanel = searchPanelByValue(
-            widget.children.cast<ExpansionPanelRadio>(),
-            widget.initialOpenPanelValue);
-      }
-    } else {
-      _currentOpenPanel = null;
-    }
-  }
-
-  bool _allIdentifiersUnique() {
-    final Map<Object, bool> identifierMap = <Object, bool>{};
-    for (final ExpansionPanelRadio child
-        in widget.children.cast<ExpansionPanelRadio>()) {
-      identifierMap[child.value] = true;
-    }
-    return identifierMap.length == widget.children.length;
-  }
-
-  bool _isChildExpanded(int index) {
-    if (widget._allowOnlyOnePanelOpen) {
-      final ExpansionPanelRadio radioWidget =
-          widget.children[index] as ExpansionPanelRadio;
-      return _currentOpenPanel?.value == radioWidget.value;
-    }
-    return widget.children[index].isExpanded;
-  }
-
-  void _handlePressed(bool isExpanded, int index) {
-    widget.expansionCallback?.call(index, isExpanded);
-
-    if (widget._allowOnlyOnePanelOpen) {
-      final ExpansionPanelRadio pressedChild =
-          widget.children[index] as ExpansionPanelRadio;
-
-      // If another ExpansionPanelRadio was already open, apply its
-      // expansionCallback (if any) to false, because it's closing.
-      for (int childIndex = 0;
-          childIndex < widget.children.length;
-          childIndex += 1) {
-        final ExpansionPanelRadio child =
-            widget.children[childIndex] as ExpansionPanelRadio;
-        if (widget.expansionCallback != null &&
-            childIndex != index &&
-            child.value == _currentOpenPanel?.value) {
-          widget.expansionCallback?.call(childIndex, false);
-        }
-      }
-
-      setState(() {
-        _currentOpenPanel = isExpanded ? null : pressedChild;
-      });
-    }
-  }
-
-  ExpansionPanelRadio? searchPanelByValue(
-      List<ExpansionPanelRadio> panels, Object? value) {
-    for (final ExpansionPanelRadio panel in panels) {
-      if (panel.value == value) return panel;
-    }
-    return null;
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    assert(
-      kElevationToShadow.containsKey(widget.elevation),
-      'Invalid value for elevation. See the kElevationToShadow constant for'
-      ' possible elevation values.',
-    );
-
-    final List<MergeableMaterialItem> items = <MergeableMaterialItem>[];
-
-    for (int index = 0; index < widget.children.length; index += 1) {
-      //todo: Uncomment to add gap between selected panels
-      /*if (_isChildExpanded(index) && index != 0 && !_isChildExpanded(index - 1))
-        items.add(MaterialGap(key: _SaltedKey<BuildContext, int>(context, index * 2 - 1)));*/
-
-      final AppExpansionPanel child = widget.children[index];
-      final Widget headerWidget = child.headerBuilder(
-        context,
-        _isChildExpanded(index),
-      );
-
-      Widget? expandIconContainer = ExpandIcon(
-        isExpanded: _isChildExpanded(index),
-        onPressed: !child.canTapOnHeader
-            ? (bool isExpanded) => _handlePressed(isExpanded, index)
-            : null,
-      );
-      if (!child.canTapOnHeader) {
-        final MaterialLocalizations localizations =
-            MaterialLocalizations.of(context);
-        expandIconContainer = Semantics(
-          label: _isChildExpanded(index)
-              ? localizations.expandedIconTapHint
-              : localizations.collapsedIconTapHint,
-          container: true,
-          child: expandIconContainer,
-        );
-      }
-
-      final iconContainer = child.iconBuilder;
-      if (iconContainer != null) {
-        expandIconContainer = iconContainer(
-          expandIconContainer,
-          _isChildExpanded(index),
-        );
-      }
-
-      Widget header = Row(
-        children: <Widget>[
-          Expanded(
-            child: AnimatedContainer(
-              duration: widget.animationDuration,
-              curve: Curves.fastOutSlowIn,
-              margin: _isChildExpanded(index)
-                  ? widget.expandedHeaderPadding
-                  : EdgeInsets.zero,
-              child: ConstrainedBox(
-                constraints: const BoxConstraints(
-                    minHeight: _kPanelHeaderCollapsedHeight),
-                child: headerWidget,
-              ),
-            ),
-          ),
-          if (expandIconContainer != null) expandIconContainer,
-        ],
-      );
-      if (child.canTapOnHeader) {
-        header = MergeSemantics(
-          child: InkWell(
-            onTap: () => _handlePressed(_isChildExpanded(index), index),
-            child: header,
-          ),
-        );
-      }
-      items.add(
-        MaterialSlice(
-          key: _SaltedKey<BuildContext, int>(context, index * 2),
-          color: child.backgroundColor,
-          child: Column(
-            children: <Widget>[
-              header,
-              AnimatedCrossFade(
-                firstChild: Container(height: 0.0),
-                secondChild: child.body,
-                firstCurve:
-                    const Interval(0.0, 0.6, curve: Curves.fastOutSlowIn),
-                secondCurve:
-                    const Interval(0.4, 1.0, curve: Curves.fastOutSlowIn),
-                sizeCurve: Curves.fastOutSlowIn,
-                crossFadeState: _isChildExpanded(index)
-                    ? CrossFadeState.showSecond
-                    : CrossFadeState.showFirst,
-                duration: widget.animationDuration,
-              ),
-            ],
-          ),
-        ),
-      );
-
-      if (_isChildExpanded(index) && index != widget.children.length - 1) {
-        items.add(MaterialGap(
-            key: _SaltedKey<BuildContext, int>(context, index * 2 + 1)));
-      }
-    }
-
-    return MergeableMaterial(
-      hasDividers: true,
-      dividerColor: widget.dividerColor,
-      elevation: widget.elevation,
-      children: items,
-    );
-  }
-}
-
-typedef ExpansionPanelIconBuilder = Widget? Function(
-  Widget child,
-  bool isExpanded,
-);
-
-class AppExpansionPanel {
-  /// Creates an expansion panel to be used as a child for [ExpansionPanelList].
-  /// See [ExpansionPanelList] for an example on how to use this widget.
-  ///
-  /// The [headerBuilder], [body], and [isExpanded] arguments must not be null.
-  AppExpansionPanel({
-    required this.headerBuilder,
-    required this.body,
-    this.iconBuilder,
-    this.isExpanded = false,
-    this.canTapOnHeader = false,
-    this.backgroundColor,
-  });
-
-  /// The widget builder that builds the expansion panels' header.
-  final ExpansionPanelHeaderBuilder headerBuilder;
-
-  /// The widget builder that builds the expansion panels' icon.
-  ///
-  /// If not pass any function, then default icon will be displayed.
-  ///
-  /// If builder function return null, then icon will not displayed.
-  final ExpansionPanelIconBuilder? iconBuilder;
-
-  /// The body of the expansion panel that's displayed below the header.
-  ///
-  /// This widget is visible only when the panel is expanded.
-  final Widget body;
-
-  /// Whether the panel is expanded.
-  ///
-  /// Defaults to false.
-  final bool isExpanded;
-
-  /// Whether tapping on the panel's header will expand/collapse it.
-  ///
-  /// Defaults to false.
-  final bool canTapOnHeader;
-
-  /// Defines the background color of the panel.
-  ///
-  /// Defaults to [ThemeData.cardColor].
-  final Color? backgroundColor;
-}

lib/common/widgets/appbar.dart

@@ -1,32 +0,0 @@
-import 'package:flutter/material.dart';
-
-class AppBarWidget extends StatelessWidget implements PreferredSizeWidget {
-  const AppBarWidget({
-    required this.child,
-    required this.controller,
-    required this.visible,
-    super.key,
-  });
-
-  final PreferredSizeWidget child;
-  final AnimationController controller;
-  final bool visible;
-
-  @override
-  Size get preferredSize => child.preferredSize;
-
-  @override
-  Widget build(BuildContext context) {
-    visible ? controller.reverse() : controller.forward();
-    return SlideTransition(
-      position: Tween<Offset>(
-        begin: Offset.zero,
-        end: const Offset(0, -1),
-      ).animate(CurvedAnimation(
-        parent: controller,
-        curve: Curves.easeInOutBack,
-      )),
-      child: child,
-    );
-  }
-}

lib/common/widgets/appbar/appbar.dart

@@ -0,0 +1,59 @@
+import 'package:PiliPlus/pages/common/multi_select/base.dart';
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+class MultiSelectAppBarWidget extends StatelessWidget
+    implements PreferredSizeWidget {
+  final MultiSelectBase ctr;
+  final bool? visible;
+  final AppBar child;
+  final List<Widget>? children;
+
+  const MultiSelectAppBarWidget({
+    super.key,
+    required this.ctr,
+    this.visible,
+    this.children,
+    required this.child,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    if (visible ?? ctr.enableMultiSelect.value) {
+      return AppBar(
+        bottom: child.bottom,
+        leading: IconButton(
+          tooltip: '取消',
+          onPressed: ctr.handleSelect,
+          icon: const Icon(Icons.close_outlined),
+        ),
+        title: Obx(() => Text('已选: ${ctr.checkedCount}')),
+        actions: [
+          TextButton(
+            style: TextButton.styleFrom(
+              visualDensity: VisualDensity.compact,
+            ),
+            onPressed: () => ctr.handleSelect(checked: true),
+            child: const Text('全选'),
+          ),
+          ...?children,
+          TextButton(
+            style: TextButton.styleFrom(
+              visualDensity: VisualDensity.compact,
+            ),
+            onPressed: ctr.onRemove,
+            child: Text(
+              '移除',
+              style: TextStyle(color: Get.theme.colorScheme.error),
+            ),
+          ),
+          const SizedBox(width: 6),
+        ],
+      );
+    }
+    return child;
+  }
+
+  @override
+  Size get preferredSize => child.preferredSize;
+}

lib/common/widgets/article_content.dart

@@ -1,94 +0,0 @@
-import 'package:PiliPlus/common/widgets/interactiveviewer_gallery/interactiveviewer_gallery.dart'
-    show SourceModel;
-import 'package:PiliPlus/common/widgets/network_img_layer.dart';
-import 'package:PiliPlus/models/dynamics/article_content_model.dart';
-import 'package:PiliPlus/utils/extension.dart';
-import 'package:cached_network_image/cached_network_image.dart';
-import 'package:flutter/material.dart';
-import 'package:flutter_html/flutter_html.dart';
-
-Widget articleContent({
-  required BuildContext context,
-  required List<ArticleContentModel> list,
-  Function(List<String>, int)? callback,
-  required double maxWidth,
-}) {
-  debugPrint('articleContent');
-  List<String>? imgList = list
-      .where((item) => item.pic != null)
-      .toList()
-      .map((item) => item.pic?.pics?.first.url ?? '')
-      .toList();
-  return SliverList.separated(
-    itemCount: list.length,
-    itemBuilder: (context, index) {
-      ArticleContentModel item = list[index];
-      if (item.text != null) {
-        List<InlineSpan> spanList = [];
-        item.text?.nodes?.forEach((item) {
-          spanList.add(TextSpan(
-            text: item.word?.words,
-            style: TextStyle(
-              letterSpacing: 0.3,
-              fontSize: 17,
-              height: LineHeight.percent(125).size,
-              fontStyle:
-                  item.word?.style?.italic == true ? FontStyle.italic : null,
-              color: item.word?.color != null
-                  ? Color(int.parse(
-                      item.word!.color!.replaceFirst('#', 'FF'),
-                      radix: 16,
-                    ))
-                  : null,
-              decoration: item.word?.style?.strikethrough == true
-                  ? TextDecoration.lineThrough
-                  : null,
-              fontWeight:
-                  item.word?.style?.bold == true ? FontWeight.bold : null,
-            ),
-          ));
-        });
-        return SelectableText.rich(TextSpan(children: spanList));
-      } else if (item.line != null) {
-        return Container(
-          alignment: Alignment.center,
-          padding: const EdgeInsets.symmetric(vertical: 10),
-          child: CachedNetworkImage(
-            imageUrl: item.line?.pic?.url?.http2https ?? '',
-            height: item.line?.pic?.height?.toDouble(),
-          ),
-        );
-      } else if (item.pic != null) {
-        return Hero(
-          tag: item.pic!.pics!.first.url!,
-          child: GestureDetector(
-            onTap: () {
-              if (callback != null) {
-                callback(
-                  imgList,
-                  imgList.indexOf(item.pic!.pics!.first.url!),
-                );
-              } else {
-                context.imageView(
-                  initialPage: imgList.indexOf(item.pic!.pics!.first.url!),
-                  imgList: imgList.map((url) => SourceModel(url: url)).toList(),
-                );
-              }
-            },
-            child: NetworkImgLayer(
-              width: maxWidth,
-              height: maxWidth *
-                  item.pic!.pics!.first.height! /
-                  item.pic!.pics!.first.width!,
-              src: item.pic!.pics!.first.url,
-            ),
-          ),
-        );
-      } else {
-        return const SizedBox.shrink();
-        // return Text('unsupported content');
-      }
-    },
-    separatorBuilder: (context, index) => const SizedBox(height: 10),
-  );
-}

lib/common/widgets/badge.dart

@@ -1,97 +1,119 @@
+import 'package:PiliPlus/models/common/badge_type.dart';
+import 'package:PiliPlus/utils/extension.dart';
 import 'package:flutter/material.dart';
+import 'package:get/get.dart';
 
 class PBadge extends StatelessWidget {
   final String? text;
+
+  final bool isStack;
   final double? top;
   final double? right;
   final double? bottom;
   final double? left;
-  final String? type;
-  final String? size;
-  final String? stack;
-  final double? fs;
-  final String? semanticsLabel;
-  final bool bold;
+  final EdgeInsets? padding;
+
+  final PBadgeType type;
+  final PBadgeSize size;
+
+  final double fontSize;
+  final bool isBold;
   final double? textScaleFactor;
 
   const PBadge({
     super.key,
-    this.text,
+    required this.text,
     this.top,
     this.right,
     this.bottom,
     this.left,
-    this.type = 'primary',
-    this.size = 'medium',
-    this.stack = 'position',
-    this.fs = 11,
-    this.semanticsLabel,
-    this.bold = true,
+    this.type = PBadgeType.primary,
+    this.size = PBadgeSize.medium,
+    this.isStack = true,
+    this.fontSize = 11,
+    this.isBold = true,
     this.textScaleFactor,
+    this.padding,
   });
 
   @override
   Widget build(BuildContext context) {
-    ColorScheme t = Theme.of(context).colorScheme;
-    // 背景色
-    Color bgColor = t.primary;
-    // 前景色
-    Color color = t.onPrimary;
-    // 边框色
+    if (text.isNullOrEmpty) {
+      return const SizedBox.shrink();
+    }
+
+    ColorScheme theme = Theme.of(context).colorScheme;
+
+    Color bgColor;
+    Color color;
     Color borderColor = Colors.transparent;
-    if (type == 'gray') {
-      bgColor = Colors.black54.withOpacity(0.4);
-      color = Colors.white;
-    }
-    if (type == 'color') {
-      bgColor = t.secondaryContainer.withOpacity(0.5);
-      color = t.onSecondaryContainer;
-    }
-    if (type == 'line') {
-      bgColor = Colors.transparent;
-      color = t.primary;
-      borderColor = t.primary;
+
+    switch (type) {
+      case PBadgeType.primary:
+        bgColor = theme.primary;
+        color = theme.onPrimary;
+      case PBadgeType.secondary:
+        bgColor = theme.secondaryContainer.withValues(alpha: 0.5);
+        color = theme.onSecondaryContainer;
+      case PBadgeType.gray:
+        bgColor = Colors.black45;
+        color = Colors.white;
+      case PBadgeType.error:
+        if (Get.isDarkMode) {
+          bgColor = theme.errorContainer;
+          color = theme.onErrorContainer;
+        } else {
+          bgColor = theme.error;
+          color = theme.onError;
+        }
+      case PBadgeType.line_primary:
+        color = theme.primary;
+        bgColor = Colors.transparent;
+        borderColor = theme.primary;
+      case PBadgeType.line_secondary:
+        color = theme.secondary;
+        bgColor = Colors.transparent;
+        borderColor = theme.secondary;
+      case PBadgeType.free:
+        bgColor = theme.freeColor;
+        color = Colors.white;
     }
 
-    EdgeInsets paddingStyle =
-        const EdgeInsets.symmetric(vertical: 2, horizontal: 3);
-    double fontSize = 11;
-    BorderRadius br = BorderRadius.circular(4);
-
-    if (size == 'small') {
-      paddingStyle = const EdgeInsets.symmetric(vertical: 2, horizontal: 3);
-      fontSize = 11;
-      br = BorderRadius.circular(3);
-    }
+    late EdgeInsets paddingStyle = const EdgeInsets.symmetric(
+      vertical: 2,
+      horizontal: 3,
+    );
+    BorderRadius br = size == PBadgeSize.small
+        ? const BorderRadius.all(Radius.circular(3))
+        : const BorderRadius.all(Radius.circular(4));
 
     Widget content = Container(
-      padding: paddingStyle,
+      padding: padding ?? paddingStyle,
       decoration: BoxDecoration(
         borderRadius: br,
         color: bgColor,
         border: Border.all(color: borderColor),
       ),
       child: Text(
-        text ?? "",
+        text!,
         textScaler: textScaleFactor != null
             ? TextScaler.linear(textScaleFactor!)
             : null,
         style: TextStyle(
           height: 1,
-          fontSize: fs ?? fontSize,
+          fontSize: fontSize,
           color: color,
-          fontWeight: bold ? FontWeight.bold : null,
+          fontWeight: isBold ? FontWeight.bold : null,
         ),
         strutStyle: StrutStyle(
           leading: 0,
           height: 1,
-          fontSize: fs ?? fontSize,
-          fontWeight: bold ? FontWeight.bold : null,
+          fontSize: fontSize,
+          fontWeight: isBold ? FontWeight.bold : null,
         ),
-        semanticsLabel: semanticsLabel,
       ),
     );
-    if (stack == 'position') {
+    if (isStack) {
       return Positioned(
         top: top,
         left: left,

lib/common/widgets/button/icon_button.dart

@@ -10,6 +10,7 @@ Widget iconButton({
   Color? bgColor,
   Color? iconColor,
 }) {
+  late final theme = Theme.of(context);
   return SizedBox(
     width: size,
     height: size,
@@ -19,12 +20,11 @@ Widget iconButton({
       icon: Icon(
         icon,
         size: iconSize ?? size / 2,
-        color: iconColor ?? Theme.of(context).colorScheme.onSecondaryContainer,
+        color: iconColor ?? theme.colorScheme.onSecondaryContainer,
       ),
       style: IconButton.styleFrom(
-        padding: EdgeInsets.all(0),
-        backgroundColor:
-            bgColor ?? Theme.of(context).colorScheme.secondaryContainer,
+        padding: EdgeInsets.zero,
+        backgroundColor: bgColor ?? theme.colorScheme.secondaryContainer,
       ),
     ),
   );
@@ -41,8 +41,8 @@ Widget mediumButton({
     child: IconButton(
       tooltip: tooltip,
       icon: Icon(icon),
-      style: ButtonStyle(
-        padding: WidgetStateProperty.all(EdgeInsets.zero),
+      style: const ButtonStyle(
+        padding: WidgetStatePropertyAll(EdgeInsets.zero),
       ),
       onPressed: onPressed,
     ),

lib/common/widgets/button/toolbar_icon_button.dart

@@ -16,6 +16,7 @@ class ToolbarIconButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final ThemeData theme = Theme.of(context);
     return SizedBox(
       width: 36,
       height: 36,
@@ -23,17 +24,15 @@ class ToolbarIconButton extends StatelessWidget {
         tooltip: tooltip,
         onPressed: onPressed,
         icon: icon,
-        highlightColor: Theme.of(context).colorScheme.secondaryContainer,
+        highlightColor: theme.colorScheme.secondaryContainer,
         color: selected
-            ? Theme.of(context).colorScheme.onSecondaryContainer
-            : Theme.of(context).colorScheme.outline,
+            ? theme.colorScheme.onSecondaryContainer
+            : theme.colorScheme.outline,
         style: ButtonStyle(
-          padding: WidgetStateProperty.all(EdgeInsets.zero),
-          backgroundColor: WidgetStateProperty.resolveWith((states) {
-            return selected
-                ? Theme.of(context).colorScheme.secondaryContainer
-                : null;
-          }),
+          padding: const WidgetStatePropertyAll(EdgeInsets.zero),
+          backgroundColor: WidgetStatePropertyAll(
+            selected ? theme.colorScheme.secondaryContainer : null,
+          ),
         ),
       ),
     );

lib/common/widgets/color_palette.dart

@@ -0,0 +1,77 @@
+import 'package:PiliPlus/common/constants.dart';
+import 'package:flutter/material.dart';
+import 'package:material_color_utilities/material_color_utilities.dart';
+
+class ColorPalette extends StatelessWidget {
+  final Color color;
+  final bool selected;
+
+  const ColorPalette({
+    super.key,
+    required this.color,
+    required this.selected,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final Hct hct = Hct.fromInt(color.value);
+    final primary = Color(Hct.from(hct.hue, 20.0, 90.0).toInt());
+    final tertiary = Color(Hct.from(hct.hue + 50, 20.0, 85.0).toInt());
+    final primaryContainer = Color(Hct.from(hct.hue, 30.0, 50.0).toInt());
+    final checkbox = Color(Hct.from(hct.hue, 30.0, 40.0).toInt());
+    Widget coloredBox(Color color) => Expanded(
+      child: ColoredBox(
+        color: color,
+        child: const SizedBox.expand(),
+      ),
+    );
+    Widget child = ClipOval(
+      child: Column(
+        children: [
+          coloredBox(primary),
+          Expanded(
+            child: Row(
+              children: [
+                coloredBox(tertiary),
+                coloredBox(primaryContainer),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+    if (selected) {
+      child = Stack(
+        clipBehavior: Clip.none,
+        alignment: Alignment.center,
+        children: [
+          child,
+          Container(
+            width: 23,
+            height: 23,
+            decoration: BoxDecoration(
+              color: checkbox,
+              shape: BoxShape.circle,
+            ),
+            child: Icon(
+              Icons.check_rounded,
+              color: primary,
+              size: 12,
+            ),
+          ),
+        ],
+      );
+    }
+    return Container(
+      width: 50,
+      height: 50,
+      padding: const EdgeInsets.all(6),
+      decoration: BoxDecoration(
+        color: theme.colorScheme.onInverseSurface,
+        borderRadius: StyleString.mdRadius,
+      ),
+      child: child,
+    );
+  }
+}

lib/common/widgets/content_container.dart

@@ -1,47 +0,0 @@
-import 'package:flutter/material.dart';
-
-class ContentContainer extends StatelessWidget {
-  final Widget? contentWidget;
-  final Widget? bottomWidget;
-  final bool isScrollable;
-  final Clip? childClipBehavior;
-
-  const ContentContainer({
-    super.key,
-    this.contentWidget,
-    this.bottomWidget,
-    this.isScrollable = true,
-    this.childClipBehavior,
-  });
-
-  @override
-  Widget build(BuildContext context) {
-    return LayoutBuilder(
-      builder: (BuildContext context, BoxConstraints constraints) {
-        return SingleChildScrollView(
-          clipBehavior: childClipBehavior ?? Clip.hardEdge,
-          physics: isScrollable ? null : const NeverScrollableScrollPhysics(),
-          child: ConstrainedBox(
-            constraints: constraints.copyWith(
-              minHeight: constraints.maxHeight,
-              maxHeight: double.infinity,
-            ),
-            child: IntrinsicHeight(
-              child: Column(
-                children: <Widget>[
-                  if (contentWidget != null)
-                    Expanded(
-                      child: contentWidget!,
-                    )
-                  else
-                    const Spacer(),
-                  if (bottomWidget != null) bottomWidget!,
-                ],
-              ),
-            ),
-          ),
-        );
-      },
-    );
-  }
-}

lib/common/widgets/custom_icon.dart

@@ -0,0 +1,30 @@
+// ignore_for_file: constant_identifier_names
+
+import 'package:flutter/widgets.dart';
+
+class CustomIcon {
+  static const IconData coin = _CustomIconData(0xe800);
+  static const IconData dm_off = _CustomIconData(0xe801);
+  static const IconData dm_on = _CustomIconData(0xe802);
+  static const IconData dm_settings = _CustomIconData(0xe803);
+  static const IconData dyn = _CustomIconData(0xe804);
+  static const IconData fav = _CustomIconData(0xe805);
+  static const IconData live_reserve = _CustomIconData(0xe806);
+  static const IconData share = _CustomIconData(0xe807);
+  static const IconData share_line = _CustomIconData(0xe808);
+  static const IconData share_node = _CustomIconData(0xe809);
+  static const IconData star_favorite_line = _CustomIconData(0xe80a);
+  static const IconData star_favorite_solid = _CustomIconData(0xe80b);
+  static const IconData thumbs_down = _CustomIconData(0xe80c);
+  static const IconData thumbs_down_outline = _CustomIconData(0xe80d);
+  static const IconData thumbs_up = _CustomIconData(0xe80e);
+  static const IconData thumbs_up_fill = _CustomIconData(0xe80f);
+  static const IconData thumbs_up_line = _CustomIconData(0xe810);
+  static const IconData thumbs_up_outline = _CustomIconData(0xe811);
+  static const IconData topic_tag = _CustomIconData(0xe812);
+  static const IconData watch_later = _CustomIconData(0xe813);
+}
+
+class _CustomIconData extends IconData {
+  const _CustomIconData(super.codePoint) : super(fontFamily: 'custom_icon');
+}

lib/common/widgets/custom_sliver_persistent_header_delegate.dart

@@ -6,31 +6,38 @@ class CustomSliverPersistentHeaderDelegate
     required this.child,
     required this.bgColor,
     double extent = 45,
-  })  : _minExtent = extent,
-        _maxExtent = extent;
+    this.needRebuild,
+  }) : _minExtent = extent,
+       _maxExtent = extent;
   final double _minExtent;
   final double _maxExtent;
   final Widget child;
-  final Color bgColor;
+  final Color? bgColor;
+  final bool? needRebuild;
 
   @override
   Widget build(
-      BuildContext context, double shrinkOffset, bool overlapsContent) {
+    BuildContext context,
+    double shrinkOffset,
+    bool overlapsContent,
+  ) {
     //创建child子组件
     //shrinkOffset：child偏移值minExtent~maxExtent
     //overlapsContent：SliverPersistentHeader覆盖其他子组件返回true，否则返回false
-    return DecoratedBox(
-      decoration: BoxDecoration(
-        color: bgColor,
-        boxShadow: [
-          BoxShadow(
-            color: bgColor,
-            offset: const Offset(0, -2),
-          ),
-        ],
-      ),
-      child: child,
-    );
+    return bgColor != null
+        ? DecoratedBox(
+            decoration: BoxDecoration(
+              color: bgColor,
+              boxShadow: [
+                BoxShadow(
+                  color: bgColor!,
+                  offset: const Offset(0, -2),
+                ),
+              ],
+            ),
+            child: child,
+          )
+        : child;
   }
 
   //SliverPersistentHeader最大高度
@@ -42,8 +49,8 @@ class CustomSliverPersistentHeaderDelegate
   double get minExtent => _minExtent;
 
   @override
-  bool shouldRebuild(
-      covariant CustomSliverPersistentHeaderDelegate oldDelegate) {
-    return oldDelegate.bgColor != bgColor;
+  bool shouldRebuild(CustomSliverPersistentHeaderDelegate oldDelegate) {
+    return oldDelegate.bgColor != bgColor ||
+        (needRebuild == true && oldDelegate.child != child);
   }
 }

lib/common/widgets/custom_toast.dart

@@ -1,33 +1,70 @@
+import 'package:PiliPlus/utils/storage_pref.dart';
 import 'package:flutter/material.dart';
-import 'package:PiliPlus/utils/storage.dart';
 
 class CustomToast extends StatelessWidget {
   const CustomToast({super.key, required this.msg});
 
   final String msg;
 
+  static double toastOpacity = Pref.defaultToastOp;
+
   @override
   Widget build(BuildContext context) {
-    final double toastOpacity = GStorage.setting
-        .get(SettingBoxKey.defaultToastOp, defaultValue: 1.0) as double;
+    final ThemeData theme = Theme.of(context);
     return Container(
-      margin:
-          EdgeInsets.only(bottom: MediaQuery.of(context).padding.bottom + 30),
+      margin: EdgeInsets.only(
+        bottom: MediaQuery.viewPaddingOf(context).bottom + 30,
+      ),
       padding: const EdgeInsets.symmetric(horizontal: 17, vertical: 10),
       decoration: BoxDecoration(
-        color: Theme.of(context)
-            .colorScheme
-            .primaryContainer
-            .withOpacity(toastOpacity),
-        borderRadius: BorderRadius.circular(20),
+        color: theme.colorScheme.primaryContainer.withValues(
+          alpha: toastOpacity,
+        ),
+        borderRadius: const BorderRadius.all(Radius.circular(20)),
       ),
       child: Text(
         msg,
         style: TextStyle(
           fontSize: 13,
-          color: Theme.of(context).colorScheme.onPrimaryContainer,
+          color: theme.colorScheme.onPrimaryContainer,
         ),
       ),
     );
   }
 }
+
+class LoadingWidget extends StatelessWidget {
+  const LoadingWidget({super.key, required this.msg});
+
+  ///loading msg
+  final String msg;
+
+  @override
+  Widget build(BuildContext context) {
+    final ThemeData theme = Theme.of(context);
+    final onSurfaceVariant = theme.colorScheme.onSurfaceVariant;
+    return Container(
+      padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 20),
+      decoration: BoxDecoration(
+        color: theme.dialogBackgroundColor,
+        borderRadius: const BorderRadius.all(Radius.circular(15)),
+      ),
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          //loading animation
+          CircularProgressIndicator(
+            strokeWidth: 3,
+            valueColor: AlwaysStoppedAnimation(onSurfaceVariant),
+          ),
+
+          //msg
+          Container(
+            margin: const EdgeInsets.only(top: 20),
+            child: Text(msg, style: TextStyle(color: onSurfaceVariant)),
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/common/widgets/custom_tooltip.dart

@@ -0,0 +1,390 @@
+import 'dart:math' as math;
+import 'dart:ui' show clampDouble;
+
+import 'package:flutter/gestures.dart';
+import 'package:flutter/material.dart';
+
+enum TooltipType { top, right }
+
+class CustomTooltip extends StatefulWidget {
+  const CustomTooltip({
+    super.key,
+    this.type = TooltipType.top,
+    required this.overlayWidget,
+    required this.child,
+    this.indicator,
+  });
+
+  final TooltipType type;
+  final Widget child;
+  final Widget Function() overlayWidget;
+  final Widget Function()? indicator;
+
+  static final List<CustomTooltipState> _openedTooltips =
+      <CustomTooltipState>[];
+
+  static bool dismissAllToolTips() {
+    if (_openedTooltips.isNotEmpty) {
+      final List<CustomTooltipState> openedTooltips = _openedTooltips.toList();
+      for (final CustomTooltipState state in openedTooltips) {
+        assert(state.mounted);
+        state._scheduleDismissTooltip();
+      }
+      return true;
+    }
+    return false;
+  }
+
+  @override
+  State<CustomTooltip> createState() => CustomTooltipState();
+}
+
+class CustomTooltipState extends State<CustomTooltip>
+    with SingleTickerProviderStateMixin {
+  static const Duration _fadeInDuration = Duration(milliseconds: 150);
+  static const Duration _fadeOutDuration = Duration(milliseconds: 75);
+
+  final OverlayPortalController _overlayController = OverlayPortalController();
+
+  AnimationController? _backingController;
+  AnimationController get _controller {
+    return _backingController ??= AnimationController(
+      duration: _fadeInDuration,
+      reverseDuration: _fadeOutDuration,
+      vsync: this,
+    )..addStatusListener(_handleStatusChanged);
+  }
+
+  CurvedAnimation? _backingOverlayAnimation;
+  CurvedAnimation get _overlayAnimation {
+    return _backingOverlayAnimation ??= CurvedAnimation(
+      parent: _controller,
+      curve: Curves.fastOutSlowIn,
+    );
+  }
+
+  LongPressGestureRecognizer? _longPressRecognizer;
+
+  AnimationStatus _animationStatus = AnimationStatus.dismissed;
+  void _handleStatusChanged(AnimationStatus status) {
+    assert(mounted);
+    switch ((_animationStatus.isDismissed, status.isDismissed)) {
+      case (false, true):
+        CustomTooltip._openedTooltips.remove(this);
+        _overlayController.hide();
+      case (true, false):
+        _overlayController.show();
+        CustomTooltip._openedTooltips.add(this);
+      case (true, true) || (false, false):
+        break;
+    }
+    _animationStatus = status;
+  }
+
+  void _scheduleShowTooltip() {
+    _controller.forward();
+  }
+
+  void _scheduleDismissTooltip() {
+    _controller.reverse();
+  }
+
+  void _handlePointerDown(PointerDownEvent event) {
+    assert(mounted);
+    const Set<PointerDeviceKind> triggerModeDeviceKinds = <PointerDeviceKind>{
+      PointerDeviceKind.invertedStylus,
+      PointerDeviceKind.stylus,
+      PointerDeviceKind.touch,
+      PointerDeviceKind.unknown,
+      PointerDeviceKind.trackpad,
+    };
+    _longPressRecognizer ??= LongPressGestureRecognizer(
+      debugOwner: this,
+      supportedDevices: triggerModeDeviceKinds,
+    );
+    _longPressRecognizer!
+      ..onLongPress = _scheduleShowTooltip
+      ..addPointer(event);
+  }
+
+  Widget _buildCustomTooltipOverlay(BuildContext context) {
+    final OverlayState overlayState = Overlay.of(
+      context,
+      debugRequiredFor: widget,
+    );
+    final RenderBox box = this.context.findRenderObject()! as RenderBox;
+    final Offset target = box.localToGlobal(
+      box.size.center(Offset.zero),
+      ancestor: overlayState.context.findRenderObject(),
+    );
+
+    final _CustomTooltipOverlay overlayChild = _CustomTooltipOverlay(
+      verticalOffset: box.size.height / 2,
+      horizontslOffset: box.size.width / 2,
+      type: widget.type,
+      animation: _overlayAnimation,
+      target: target,
+      onDismiss: _scheduleDismissTooltip,
+      overlayWidget: widget.overlayWidget,
+      indicator: widget.indicator,
+    );
+
+    return SelectionContainer.maybeOf(context) == null
+        ? overlayChild
+        : SelectionContainer.disabled(child: overlayChild);
+  }
+
+  @protected
+  @override
+  void dispose() {
+    CustomTooltip._openedTooltips.remove(this);
+    _longPressRecognizer?.onLongPressCancel = null;
+    _longPressRecognizer?.dispose();
+    _backingController?.dispose();
+    _backingOverlayAnimation?.dispose();
+    super.dispose();
+  }
+
+  @protected
+  @override
+  Widget build(BuildContext context) {
+    Widget result = Listener(
+      onPointerDown: _handlePointerDown,
+      behavior: HitTestBehavior.opaque,
+      child: widget.child,
+    );
+    return OverlayPortal(
+      controller: _overlayController,
+      overlayChildBuilder: _buildCustomTooltipOverlay,
+      child: result,
+    );
+  }
+}
+
+class _CustomTooltipOverlay extends StatelessWidget {
+  const _CustomTooltipOverlay({
+    required this.verticalOffset,
+    required this.horizontslOffset,
+    required this.type,
+    required this.animation,
+    required this.target,
+    required this.onDismiss,
+    required this.overlayWidget,
+    this.indicator,
+  });
+
+  final double verticalOffset;
+  final double horizontslOffset;
+  final TooltipType type;
+  final Animation<double> animation;
+  final Offset target;
+  final VoidCallback onDismiss;
+  final Widget Function() overlayWidget;
+  final Widget Function()? indicator;
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      behavior: HitTestBehavior.opaque,
+      onTap: onDismiss,
+      child: CustomMultiChildLayout(
+        delegate: _CustomMultiTooltipPositionDelegate(
+          type: type,
+          target: target,
+          verticalOffset: verticalOffset,
+          horizontslOffset: horizontslOffset,
+          preferBelow: false,
+        ),
+        children: [
+          LayoutId(
+            id: 'overlay',
+            child: overlayWidget(),
+          ),
+          if (indicator != null)
+            LayoutId(
+              id: 'indicator',
+              child: indicator!(),
+            ),
+        ],
+      ),
+    );
+  }
+}
+
+class _CustomMultiTooltipPositionDelegate extends MultiChildLayoutDelegate {
+  _CustomMultiTooltipPositionDelegate({
+    required this.type,
+    required this.target,
+    required this.verticalOffset,
+    required this.horizontslOffset,
+    required this.preferBelow,
+  });
+
+  final TooltipType type;
+
+  final Offset target;
+
+  final double verticalOffset;
+
+  final double horizontslOffset;
+
+  final bool preferBelow;
+
+  @override
+  void performLayout(Size size) {
+    switch (type) {
+      case TooltipType.top:
+        Size? indicatorSize;
+        if (hasChild('indicator')) {
+          indicatorSize = layoutChild('indicator', BoxConstraints.loose(size));
+        }
+
+        if (hasChild('overlay')) {
+          final overlaySize = layoutChild(
+            'overlay',
+            BoxConstraints.loose(size),
+          );
+          Offset offset = positionDependentBox(
+            type: type,
+            size: size,
+            childSize: overlaySize,
+            target: target,
+            verticalOffset: verticalOffset,
+            horizontslOffset: horizontslOffset,
+            preferBelow: preferBelow,
+          );
+          if (indicatorSize != null) {
+            offset = Offset(offset.dx, offset.dy - indicatorSize.height + 1);
+            positionChild(
+              'indicator',
+              Offset(
+                target.dx - indicatorSize.width / 2,
+                offset.dy + overlaySize.height - 1,
+              ),
+            );
+          }
+          positionChild('overlay', offset);
+        }
+      case TooltipType.right:
+        Size? indicatorSize;
+        if (hasChild('indicator')) {
+          indicatorSize = layoutChild('indicator', BoxConstraints.loose(size));
+        }
+
+        if (hasChild('overlay')) {
+          final overlaySize = layoutChild(
+            'overlay',
+            BoxConstraints.loose(size),
+          );
+          Offset offset = positionDependentBox(
+            type: type,
+            size: size,
+            childSize: overlaySize,
+            target: target,
+            verticalOffset: verticalOffset,
+            horizontslOffset: horizontslOffset,
+            preferBelow: preferBelow,
+          );
+          if (indicatorSize != null) {
+            offset = Offset(offset.dx + indicatorSize.height - 1, offset.dy);
+            positionChild(
+              'indicator',
+              Offset(
+                offset.dx - indicatorSize.width + 1,
+                target.dy - indicatorSize.height / 2,
+              ),
+            );
+          }
+          positionChild('overlay', offset);
+        }
+    }
+  }
+
+  @override
+  bool shouldRelayout(_CustomMultiTooltipPositionDelegate oldDelegate) {
+    return target != oldDelegate.target ||
+        verticalOffset != oldDelegate.verticalOffset ||
+        preferBelow != oldDelegate.preferBelow;
+  }
+}
+
+class TrianglePainter extends CustomPainter {
+  TrianglePainter(this.color, {this.type = TooltipType.top});
+  final TooltipType type;
+  final Color color;
+
+  @override
+  void paint(Canvas canvas, Size size) {
+    final paint = Paint()
+      ..color = color
+      ..style = PaintingStyle.fill;
+
+    Path path;
+    switch (type) {
+      case TooltipType.top:
+        path = Path()
+          ..moveTo(0, 0)
+          ..lineTo(size.width, 0)
+          ..lineTo(size.width / 2, size.height)
+          ..close();
+      case TooltipType.right:
+        path = Path()
+          ..moveTo(0, size.height / 2)
+          ..lineTo(size.width, 0)
+          ..lineTo(size.width, size.height)
+          ..close();
+    }
+
+    canvas.drawPath(path, paint);
+  }
+
+  @override
+  bool shouldRepaint(TrianglePainter oldDelegate) => color != oldDelegate.color;
+}
+
+Offset positionDependentBox({
+  required TooltipType type,
+  required Size size,
+  required Size childSize,
+  required Offset target,
+  required bool preferBelow,
+  double verticalOffset = 0.0,
+  double horizontslOffset = 0.0,
+  double margin = 10.0,
+}) {
+  switch (type) {
+    case TooltipType.top:
+      // VERTICAL DIRECTION
+      final bool fitsBelow =
+          target.dy + verticalOffset + childSize.height <= size.height - margin;
+      final bool fitsAbove =
+          target.dy - verticalOffset - childSize.height >= margin;
+      final bool tooltipBelow = fitsAbove == fitsBelow
+          ? preferBelow
+          : fitsBelow;
+      final double y;
+      if (tooltipBelow) {
+        y = math.min(target.dy + verticalOffset, size.height - margin);
+      } else {
+        y = math.max(target.dy - verticalOffset - childSize.height, margin);
+      } // HORIZONTAL DIRECTION
+      final double flexibleSpace = size.width - childSize.width;
+      final double x = flexibleSpace <= 2 * margin
+          // If there's not enough horizontal space for margin + child, center the
+          // child.
+          ? flexibleSpace / 2.0
+          : clampDouble(
+              target.dx - childSize.width / 2,
+              margin,
+              flexibleSpace - margin,
+            );
+      return Offset(x, y);
+    case TooltipType.right:
+      final double dy = math.max(margin, target.dy - childSize.height / 2);
+      final double dx = math.min(
+        target.dx + horizontslOffset,
+        size.width - childSize.width - margin,
+      );
+      return Offset(dx, dy);
+  }
+}

lib/common/widgets/dialog.dart

@@ -1,32 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:get/get.dart';
-
-void showConfirmDialog({
-  required BuildContext context,
-  required String title,
-  String? content,
-  required VoidCallback onConfirm,
-}) {
-  showDialog(
-    context: context,
-    builder: (context) {
-      return AlertDialog(
-        title: Text(title),
-        content: content == null ? null : Text(content),
-        actions: [
-          TextButton(
-            onPressed: Get.back,
-            child: Text(
-              '取消',
-              style: TextStyle(color: Theme.of(context).colorScheme.outline),
-            ),
-          ),
-          TextButton(
-            onPressed: onConfirm,
-            child: Text('确认'),
-          ),
-        ],
-      );
-    },
-  );
-}

lib/common/widgets/dialog/dialog.dart

@@ -0,0 +1,107 @@
+import 'package:flutter/material.dart';
+import 'package:get/get.dart';
+
+void showConfirmDialog({
+  required BuildContext context,
+  required String title,
+  dynamic content,
+  required VoidCallback onConfirm,
+}) {
+  showDialog(
+    context: context,
+    builder: (context) {
+      return AlertDialog(
+        title: Text(title),
+        content: content is String
+            ? Text(content)
+            : content is Widget
+            ? content
+            : null,
+        actions: [
+          TextButton(
+            onPressed: Get.back,
+            child: Text(
+              '取消',
+              style: TextStyle(color: Theme.of(context).colorScheme.outline),
+            ),
+          ),
+          TextButton(
+            onPressed: () {
+              Get.back();
+              onConfirm();
+            },
+            child: const Text('确认'),
+          ),
+        ],
+      );
+    },
+  );
+}
+
+void showPgcFollowDialog({
+  required BuildContext context,
+  required String type,
+  required int followStatus,
+  required ValueChanged<int> onUpdateStatus,
+}) {
+  Widget statusItem({
+    required bool enabled,
+    required String text,
+    required VoidCallback onTap,
+  }) {
+    return ListTile(
+      dense: true,
+      enabled: enabled,
+      title: Padding(
+        padding: const EdgeInsets.only(left: 10),
+        child: Text(
+          '标记为 $text',
+          style: const TextStyle(fontSize: 14),
+        ),
+      ),
+      trailing: !enabled ? const Icon(size: 22, Icons.check) : null,
+      onTap: onTap,
+    );
+  }
+
+  showDialog(
+    context: context,
+    builder: (context) => AlertDialog(
+      clipBehavior: Clip.hardEdge,
+      contentPadding: const EdgeInsets.symmetric(vertical: 12),
+      content: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          ...const [
+            (followStatus: 3, title: '看过'),
+            (followStatus: 2, title: '在看'),
+            (followStatus: 1, title: '想看'),
+          ].map(
+            (item) => statusItem(
+              enabled: followStatus != item.followStatus,
+              text: item.title,
+              onTap: () {
+                Get.back();
+                onUpdateStatus(item.followStatus);
+              },
+            ),
+          ),
+          ListTile(
+            dense: true,
+            title: Padding(
+              padding: const EdgeInsets.only(left: 10),
+              child: Text(
+                '取消$type',
+                style: const TextStyle(fontSize: 14),
+              ),
+            ),
+            onTap: () {
+              Get.back();
+              onUpdateStatus(-1);
+            },
+          ),
+        ],
+      ),
+    ),
+  );
+}

lib/common/widgets/dialog/report.dart

@@ -0,0 +1,249 @@
+import 'package:PiliPlus/common/widgets/radio_widget.dart';
+import 'package:PiliPlus/utils/extension.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
+import 'package:get/get.dart';
+
+void autoWrapReportDialog(
+  BuildContext context,
+  Map<String, Map<int, String>> options,
+  Future<Map> Function(int reasonType, String? reasonDesc, bool banUid)
+  onSuccess,
+) {
+  int? reasonType;
+  String? reasonDesc;
+  bool banUid = false;
+  late final key = GlobalKey<FormState>();
+  showDialog(
+    context: context,
+    builder: (context) => StatefulBuilder(
+      builder: (context, setState) {
+        return AlertDialog(
+          title: const Text('举报'),
+          titlePadding: const EdgeInsets.only(left: 22, top: 16, right: 22),
+          contentPadding: const EdgeInsets.symmetric(vertical: 5),
+          actionsPadding: const EdgeInsets.only(
+            left: 16,
+            right: 16,
+            bottom: 10,
+          ),
+          content: Form(
+            key: key,
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Flexible(
+                  child: SingleChildScrollView(
+                    child: AnimatedSize(
+                      duration: const Duration(milliseconds: 200),
+                      child: Column(
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: [
+                          const Padding(
+                            padding: EdgeInsets.only(
+                              left: 22,
+                              right: 22,
+                              bottom: 5,
+                            ),
+                            child: Text('请选择举报的理由：'),
+                          ),
+                          ...options.entries.map(
+                            (entry) => WrapRadioOptionsGroup<int>(
+                              groupTitle: entry.key,
+                              options: entry.value,
+                              selectedValue: reasonType,
+                              onChanged: (value) =>
+                                  setState(() => reasonType = value),
+                            ),
+                          ),
+                          if (reasonType == 0)
+                            ReasonField(
+                              onChanged: (value) => reasonDesc = value,
+                            ),
+                        ],
+                      ),
+                    ),
+                  ),
+                ),
+                Padding(
+                  padding: const EdgeInsets.only(left: 14, top: 6),
+                  child: CheckBoxText(
+                    text: '拉黑该用户',
+                    onChanged: (value) => banUid = value,
+                  ),
+                ),
+              ],
+            ),
+          ),
+          actions: [
+            TextButton(
+              onPressed: Get.back,
+              child: Text(
+                '取消',
+                style: TextStyle(color: Theme.of(context).colorScheme.outline),
+              ),
+            ),
+            TextButton(
+              onPressed: () async {
+                if (reasonType == null ||
+                    (reasonType == 0 && key.currentState?.validate() != true)) {
+                  return;
+                }
+                SmartDialog.showLoading();
+                try {
+                  final data = await onSuccess(reasonType!, reasonDesc, banUid);
+                  SmartDialog.dismiss();
+                  if (data['code'] == 0) {
+                    Get.back();
+                    SmartDialog.showToast('举报成功');
+                  } else {
+                    SmartDialog.showToast(data['message']);
+                  }
+                } catch (e) {
+                  SmartDialog.dismiss();
+                  SmartDialog.showToast('提交失败：$e');
+                }
+              },
+              child: const Text('确定'),
+            ),
+          ],
+        );
+      },
+    ),
+  );
+}
+
+class ReasonField extends StatefulWidget {
+  final ValueChanged<String> onChanged;
+  String? _validator(String? value) => value.isNullOrEmpty ? '理由不能为空' : null;
+
+  const ReasonField({super.key, required this.onChanged});
+
+  @override
+  State<ReasonField> createState() => _ReasonFieldState();
+}
+
+class _ReasonFieldState extends State<ReasonField> {
+  final _controller = TextEditingController();
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(left: 22, top: 5, right: 22),
+      child: TextFormField(
+        controller: _controller,
+        autofocus: true,
+        minLines: 4,
+        maxLines: 4,
+        decoration: const InputDecoration(
+          labelText: '为帮助审核人员更快处理，请补充问题类型和出现位置等详细信息',
+          border: OutlineInputBorder(),
+          contentPadding: EdgeInsets.all(10),
+        ),
+        onChanged: widget.onChanged,
+        validator: widget._validator,
+      ),
+    );
+  }
+}
+
+class CheckBoxText extends StatefulWidget {
+  final String text;
+  final ValueChanged<bool> onChanged;
+  final bool selected;
+
+  const CheckBoxText({
+    super.key,
+    required this.text,
+    required this.onChanged,
+    this.selected = false,
+  });
+
+  @override
+  State<CheckBoxText> createState() => _CheckBoxTextState();
+}
+
+class _CheckBoxTextState extends State<CheckBoxText> {
+  late bool _selected;
+
+  @override
+  void initState() {
+    super.initState();
+    _selected = widget.selected;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+    return InkWell(
+      onTap: () {
+        setState(() {
+          _selected = !_selected;
+        });
+        widget.onChanged(_selected);
+      },
+      child: Padding(
+        padding: const EdgeInsets.all(4),
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Icon(
+              size: 22,
+              _selected
+                  ? Icons.check_box_outlined
+                  : Icons.check_box_outline_blank,
+              color: _selected
+                  ? colorScheme.primary
+                  : colorScheme.onSurfaceVariant,
+            ),
+            Text(
+              ' ${widget.text}',
+              style: TextStyle(color: _selected ? colorScheme.primary : null),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class ReportOptions {
+  // from https://s1.hdslb.com/bfs/seed/jinkela/comment-h5/static/js/605.chunks.js
+  static Map<String, Map<int, String>> get commentReport => const {
+    '违反法律法规': {9: '违法违规', 2: '色情', 10: '低俗', 12: '赌博诈骗', 23: '违法信息外链'},
+    '谣言类不实信息': {19: '涉政谣言', 22: '虚假不实信息', 20: '涉社会事件谣言'},
+    '侵犯个人权益': {7: '人身攻击', 15: '侵犯隐私'},
+    '有害社区环境': {
+      1: '垃圾广告',
+      4: '引战',
+      5: '剧透',
+      3: '刷屏',
+      8: '视频不相关',
+      18: '违规抽奖',
+      17: '青少年不良信息',
+    },
+    '其他': {0: '其他'},
+  };
+
+  static Map<String, Map<int, String>> get dynamicReport => const {
+    '': {
+      4: '垃圾广告',
+      8: '引战',
+      1: '色情',
+      5: '人身攻击',
+      3: '违法信息',
+      9: '涉政谣言',
+      10: '涉社会事件谣言',
+      12: '虚假不实信息',
+      13: '违法信息外链',
+      0: '其他',
+    },
+  };
+}

lib/common/widgets/dialog/report_member.dart

@@ -0,0 +1,126 @@
+import 'package:PiliPlus/common/widgets/radio_widget.dart';
+import 'package:PiliPlus/http/member.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
+import 'package:get/get.dart';
+
+class MemberReportPanel extends StatefulWidget {
+  const MemberReportPanel({
+    super.key,
+    required this.name,
+    required this.mid,
+  });
+
+  final dynamic name;
+  final dynamic mid;
+
+  @override
+  State<MemberReportPanel> createState() => _MemberReportPanelState();
+}
+
+class _MemberReportPanelState extends State<MemberReportPanel> {
+  final List<bool> _reasonList = List.generate(3, (_) => false);
+  final Set<int> _reason = {};
+  int? _reasonV2;
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return SingleChildScrollView(
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(
+            '举报: ${widget.name}',
+            style: const TextStyle(fontSize: 18),
+          ),
+          const SizedBox(height: 4),
+          Text('uid: ${widget.mid}'),
+          const SizedBox(height: 10),
+          const Text('举报内容（必选，可多选）'),
+          ...List.generate(
+            3,
+            (index) => _checkBoxWidget(
+              _reasonList[index],
+              (value) {
+                setState(() => _reasonList[index] = value);
+                if (value) {
+                  _reason.add(index + 1);
+                } else {
+                  _reason.remove(index + 1);
+                }
+              },
+              const ['头像违规', '昵称违规', '签名违规'][index],
+            ),
+          ),
+          const Text('举报理由（单选，非必选）'),
+          ...List.generate(
+            5,
+            (index) => RadioWidget<int>(
+              value: index,
+              groupValue: _reasonV2,
+              onChanged: (value) {
+                setState(() => _reasonV2 = value);
+              },
+              title: const ['色情低俗', '不实信息', '违禁', '人身攻击', '赌博诈骗'][index],
+            ),
+          ),
+          const SizedBox(height: 10),
+          Row(
+            mainAxisAlignment: MainAxisAlignment.end,
+            children: [
+              TextButton(
+                onPressed: Get.back,
+                child: Text(
+                  '取消',
+                  style: TextStyle(color: theme.colorScheme.outline),
+                ),
+              ),
+              TextButton(
+                onPressed: () async {
+                  if (_reason.isEmpty) {
+                    SmartDialog.showToast('至少选择一项作为举报内容');
+                  } else {
+                    Get.back();
+                    var result = await MemberHttp.reportMember(
+                      widget.mid,
+                      reason: _reason.join(','),
+                      reasonV2: _reasonV2 != null ? _reasonV2! + 1 : null,
+                    );
+                    if (result['msg'] is String && result['msg'].isNotEmpty) {
+                      SmartDialog.showToast(result['msg']);
+                    } else {
+                      SmartDialog.showToast('举报失败');
+                    }
+                  }
+                },
+                child: const Text('确定'),
+              ),
+            ],
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+Widget _checkBoxWidget(
+  bool defValue,
+  ValueChanged onChanged,
+  String title,
+) {
+  return InkWell(
+    onTap: () => onChanged(!defValue),
+    child: Row(
+      children: [
+        Checkbox(
+          value: defValue,
+          onChanged: onChanged,
+          materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+        ),
+        Text(title),
+      ],
+    ),
+  );
+}

lib/common/widgets/disabled_icon.dart

@@ -0,0 +1,102 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+import 'package:flutter/rendering.dart';
+
+class DisabledIcon<T extends Widget> extends SingleChildRenderObjectWidget {
+  final Color? color;
+  final double lineLengthScale;
+  final StrokeCap strokeCap;
+
+  const DisabledIcon({
+    super.key,
+    required T child,
+    this.color,
+    double? lineLengthScale,
+    StrokeCap? strokeCap,
+  }) : lineLengthScale = lineLengthScale ?? 0.9,
+       strokeCap = strokeCap ?? StrokeCap.butt,
+       super(child: child);
+
+  @override
+  RenderObject createRenderObject(BuildContext context) {
+    return RenderMaskedIcon(
+      color ??
+          (child is Icon
+              ? (child as Icon).color ?? IconTheme.of(context).color!
+              : IconTheme.of(context).color!),
+      lineLengthScale,
+      strokeCap,
+    );
+  }
+
+  T enable() => child as T;
+}
+
+class RenderMaskedIcon extends RenderProxyBox {
+  final Color color;
+  final double lineLengthScale;
+  final StrokeCap strokeCap;
+
+  RenderMaskedIcon(this.color, this.lineLengthScale, this.strokeCap);
+
+  @override
+  void paint(PaintingContext context, Offset offset) {
+    final strokeWidth = size.width / 12;
+
+    final canvas = context.canvas;
+    var rect = offset & size;
+
+    final sqrt2Width = strokeWidth * sqrt2; // rotate pi / 4
+
+    // final path = Path.combine(
+    //   PathOperation.difference,
+    //   Path()..addRect(rect),
+    //   Path()..moveTo(rect.left, rect.top)
+    //   ..relativeLineTo(sqrt2Width, 0)
+    //   ..lineTo(rect.right, rect.bottom - sqrt2Width)
+    //   ..lineTo(rect.right, rect.bottom)
+    //   ..close(),
+    // );
+
+    final path = Path.combine(
+      PathOperation.union,
+      Path() // bottom
+        ..moveTo(rect.left, rect.bottom)
+        ..lineTo(rect.left, rect.top + sqrt2Width)
+        ..lineTo(rect.right - sqrt2Width, rect.bottom)
+        ..close(),
+      Path() // top
+        ..moveTo(rect.right, rect.top)
+        ..lineTo(rect.right, rect.bottom - sqrt2Width)
+        ..lineTo(rect.left + sqrt2Width, rect.top),
+    );
+
+    canvas
+      ..save()
+      ..clipPath(path, doAntiAlias: false);
+    super.paint(context, offset);
+
+    context.canvas.restore();
+
+    final linePaint = Paint()
+      ..color = color
+      ..strokeWidth = strokeWidth
+      ..strokeCap = strokeCap;
+
+    final strokeOffset = strokeWidth * sqrt1_2 / 2;
+    rect = rect
+        .translate(-strokeOffset, strokeOffset)
+        .deflate(size.width * lineLengthScale);
+    canvas.drawLine(
+      rect.topLeft,
+      rect.bottomRight,
+      linePaint,
+    );
+  }
+}
+
+extension DisabledIconExt on Icon {
+  DisabledIcon<Icon> disable([double? lineLengthScale]) =>
+      DisabledIcon(lineLengthScale: lineLengthScale, child: this);
+}

lib/common/widgets/dyn/button.dart

@@ -0,0 +1,789 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// ignore_for_file: uri_does_not_exist_in_doc_import
+
+/// @docImport 'elevated_button_theme.dart';
+/// @docImport 'menu_anchor.dart';
+/// @docImport 'text_button_theme.dart';
+/// @docImport 'text_theme.dart';
+/// @docImport 'theme.dart';
+library;
+
+import 'dart:math' as math;
+
+import 'package:PiliPlus/common/widgets/dyn/ink_well.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart' hide InkWell;
+import 'package:flutter/rendering.dart';
+
+/// The base [StatefulWidget] class for buttons whose style is defined by a [ButtonStyle] object.
+///
+/// Concrete subclasses must override [defaultStyleOf] and [themeStyleOf].
+///
+/// See also:
+///  * [ElevatedButton], a filled button whose material elevates when pressed.
+///  * [FilledButton], a filled button that doesn't elevate when pressed.
+///  * [FilledButton.tonal], a filled button variant that uses a secondary fill color.
+///  * [OutlinedButton], a button with an outlined border and no fill color.
+///  * [TextButton], a button with no outline or fill color.
+///  * <https://m3.material.io/components/buttons/overview>, an overview of each of
+///    the Material Design button types and how they should be used in designs.
+abstract class ButtonStyleButton extends StatefulWidget {
+  /// Abstract const constructor. This constructor enables subclasses to provide
+  /// const constructors so that they can be used in const expressions.
+  const ButtonStyleButton({
+    super.key,
+    required this.onPressed,
+    required this.onLongPress,
+    required this.onHover,
+    required this.onFocusChange,
+    required this.style,
+    required this.focusNode,
+    required this.autofocus,
+    required this.clipBehavior,
+    this.statesController,
+    this.isSemanticButton = true,
+    @Deprecated(
+      'Remove this parameter as it is now ignored. '
+      'Use ButtonStyle.iconAlignment instead. '
+      'This feature was deprecated after v3.28.0-1.0.pre.',
+    )
+    this.iconAlignment,
+    this.tooltip,
+    required this.child,
+  });
+
+  /// Called when the button is tapped or otherwise activated.
+  ///
+  /// If this callback and [onLongPress] are null, then the button will be disabled.
+  ///
+  /// See also:
+  ///
+  ///  * [enabled], which is true if the button is enabled.
+  final VoidCallback? onPressed;
+
+  /// Called when the button is long-pressed.
+  ///
+  /// If this callback and [onPressed] are null, then the button will be disabled.
+  ///
+  /// See also:
+  ///
+  ///  * [enabled], which is true if the button is enabled.
+  final VoidCallback? onLongPress;
+
+  /// Called when a pointer enters or exits the button response area.
+  ///
+  /// The value passed to the callback is true if a pointer has entered this
+  /// part of the material and false if a pointer has exited this part of the
+  /// material.
+  final ValueChanged<bool>? onHover;
+
+  /// Handler called when the focus changes.
+  ///
+  /// Called with true if this widget's node gains focus, and false if it loses
+  /// focus.
+  final ValueChanged<bool>? onFocusChange;
+
+  /// Customizes this button's appearance.
+  ///
+  /// Non-null properties of this style override the corresponding
+  /// properties in [themeStyleOf] and [defaultStyleOf]. [WidgetStateProperty]s
+  /// that resolve to non-null values will similarly override the corresponding
+  /// [WidgetStateProperty]s in [themeStyleOf] and [defaultStyleOf].
+  ///
+  /// Null by default.
+  final ButtonStyle? style;
+
+  /// {@macro flutter.material.Material.clipBehavior}
+  ///
+  /// Defaults to [Clip.none] unless [ButtonStyle.backgroundBuilder] or
+  /// [ButtonStyle.foregroundBuilder] is specified. In those
+  /// cases the default is [Clip.antiAlias].
+  final Clip? clipBehavior;
+
+  /// {@macro flutter.widgets.Focus.focusNode}
+  final FocusNode? focusNode;
+
+  /// {@macro flutter.widgets.Focus.autofocus}
+  final bool autofocus;
+
+  /// {@macro flutter.material.inkwell.statesController}
+  final WidgetStatesController? statesController;
+
+  /// Determine whether this subtree represents a button.
+  ///
+  /// If this is null, the screen reader will not announce "button" when this
+  /// is focused. This is useful for [MenuItemButton] and [SubmenuButton] when we
+  /// traverse the menu system.
+  ///
+  /// Defaults to true.
+  final bool? isSemanticButton;
+
+  /// {@macro flutter.material.ButtonStyleButton.iconAlignment}
+  @Deprecated(
+    'Remove this parameter as it is now ignored. '
+    'Use ButtonStyle.iconAlignment instead. '
+    'This feature was deprecated after v3.28.0-1.0.pre.',
+  )
+  final IconAlignment? iconAlignment;
+
+  /// Text that describes the action that will occur when the button is pressed or
+  /// hovered over.
+  ///
+  /// This text is displayed when the user long-presses or hovers over the button
+  /// in a tooltip. This string is also used for accessibility.
+  ///
+  /// If null, the button will not display a tooltip.
+  final String? tooltip;
+
+  /// Typically the button's label.
+  ///
+  /// {@macro flutter.widgets.ProxyWidget.child}
+  final Widget? child;
+
+  /// Returns a [ButtonStyle] that's based primarily on the [Theme]'s
+  /// [ThemeData.textTheme] and [ThemeData.colorScheme], but has most values
+  /// filled out (non-null).
+  ///
+  /// The returned style can be overridden by the [style] parameter and by the
+  /// style returned by [themeStyleOf] that some button-specific themes like
+  /// [TextButtonTheme] or [ElevatedButtonTheme] override. For example the
+  /// default style of the [TextButton] subclass can be overridden with its
+  /// [TextButton.style] constructor parameter, or with a [TextButtonTheme].
+  ///
+  /// Concrete button subclasses should return a [ButtonStyle] with as many
+  /// non-null properties as possible, where all of the non-null
+  /// [WidgetStateProperty] properties resolve to non-null values.
+  ///
+  /// ## Properties that can be null
+  ///
+  /// Some properties, like [ButtonStyle.fixedSize] would override other values
+  /// in the same [ButtonStyle] if set, so they are allowed to be null.  Here is
+  /// a summary of properties that are allowed to be null when returned in the
+  /// [ButtonStyle] returned by this function, an why:
+  ///
+  /// - [ButtonStyle.fixedSize] because it would override other values in the
+  ///   same [ButtonStyle], like [ButtonStyle.maximumSize].
+  /// - [ButtonStyle.side] because null is a valid value for a button that has
+  ///   no side. [OutlinedButton] returns a non-null default for this, however.
+  /// - [ButtonStyle.backgroundBuilder] and [ButtonStyle.foregroundBuilder]
+  ///   because they would override the [ButtonStyle.foregroundColor] and
+  ///   [ButtonStyle.backgroundColor] of the same [ButtonStyle].
+  ///
+  /// See also:
+  ///
+  /// * [themeStyleOf], returns the ButtonStyle of this button's component
+  ///   theme.
+  @protected
+  ButtonStyle defaultStyleOf(BuildContext context);
+
+  /// Returns the ButtonStyle that belongs to the button's component theme.
+  ///
+  /// The returned style can be overridden by the [style] parameter.
+  ///
+  /// Concrete button subclasses should return the ButtonStyle for the
+  /// nearest subclass-specific inherited theme, and if no such theme
+  /// exists, then the same value from the overall [Theme].
+  ///
+  /// See also:
+  ///
+  ///  * [defaultStyleOf], Returns the default [ButtonStyle] for this button.
+  @protected
+  ButtonStyle? themeStyleOf(BuildContext context);
+
+  /// Whether the button is enabled or disabled.
+  ///
+  /// Buttons are disabled by default. To enable a button, set its [onPressed]
+  /// or [onLongPress] properties to a non-null value.
+  bool get enabled => onPressed != null || onLongPress != null;
+
+  @override
+  State<ButtonStyleButton> createState() => _ButtonStyleState();
+
+  @override
+  void debugFillProperties(DiagnosticPropertiesBuilder properties) {
+    super.debugFillProperties(properties);
+    properties
+      ..add(
+        FlagProperty('enabled', value: enabled, ifFalse: 'disabled'),
+      )
+      ..add(
+        DiagnosticsProperty<ButtonStyle>('style', style, defaultValue: null),
+      )
+      ..add(
+        DiagnosticsProperty<FocusNode>(
+          'focusNode',
+          focusNode,
+          defaultValue: null,
+        ),
+      );
+  }
+
+  /// Returns null if [value] is null, otherwise `WidgetStatePropertyAll<T>(value)`.
+  ///
+  /// A convenience method for subclasses.
+  static WidgetStateProperty<T>? allOrNull<T>(T? value) =>
+      value == null ? null : WidgetStatePropertyAll<T>(value);
+
+  /// Returns null if [enabled] and [disabled] are null.
+  /// Otherwise, returns a [WidgetStateProperty] that resolves to [disabled]
+  /// when [WidgetState.disabled] is active, and [enabled] otherwise.
+  ///
+  /// A convenience method for subclasses.
+  static WidgetStateProperty<Color?>? defaultColor(
+    Color? enabled,
+    Color? disabled,
+  ) {
+    if ((enabled ?? disabled) == null) {
+      return null;
+    }
+    return WidgetStateProperty<Color?>.fromMap(<WidgetStatesConstraint, Color?>{
+      WidgetState.disabled: disabled,
+      WidgetState.any: enabled,
+    });
+  }
+
+  /// A convenience method used by subclasses in the framework, that returns an
+  /// interpolated value based on the [fontSizeMultiplier] parameter:
+  ///
+  ///  * 0 - 1 [geometry1x]
+  ///  * 1 - 2 lerp([geometry1x], [geometry2x], [fontSizeMultiplier] - 1)
+  ///  * 2 - 3 lerp([geometry2x], [geometry3x], [fontSizeMultiplier] - 2)
+  ///  * otherwise [geometry3x]
+  ///
+  /// This method is used by the framework for estimating the default paddings to
+  /// use on a button with a text label, when the system text scaling setting
+  /// changes. It's usually supplied with empirical [geometry1x], [geometry2x],
+  /// [geometry3x] values adjusted for different system text scaling values, when
+  /// the unscaled font size is set to 14.0 (the default [TextTheme.labelLarge]
+  /// value).
+  ///
+  /// The `fontSizeMultiplier` argument, for historical reasons, is the default
+  /// font size specified in the [ButtonStyle], scaled by the ambient font
+  /// scaler, then divided by 14.0 (the default font size used in buttons).
+  static EdgeInsetsGeometry scaledPadding(
+    EdgeInsetsGeometry geometry1x,
+    EdgeInsetsGeometry geometry2x,
+    EdgeInsetsGeometry geometry3x,
+    double fontSizeMultiplier,
+  ) {
+    return switch (fontSizeMultiplier) {
+      <= 1 => geometry1x,
+      < 2 => EdgeInsetsGeometry.lerp(
+        geometry1x,
+        geometry2x,
+        fontSizeMultiplier - 1,
+      )!,
+      < 3 => EdgeInsetsGeometry.lerp(
+        geometry2x,
+        geometry3x,
+        fontSizeMultiplier - 2,
+      )!,
+      _ => geometry3x,
+    };
+  }
+}
+
+/// The base [State] class for buttons whose style is defined by a [ButtonStyle] object.
+///
+/// See also:
+///
+///  * [ButtonStyleButton], the [StatefulWidget] subclass for which this class is the [State].
+///  * [ElevatedButton], a filled button whose material elevates when pressed.
+///  * [FilledButton], a filled ButtonStyleButton that doesn't elevate when pressed.
+///  * [OutlinedButton], similar to [TextButton], but with an outline.
+///  * [TextButton], a simple button without a shadow.
+class _ButtonStyleState extends State<ButtonStyleButton>
+    with TickerProviderStateMixin {
+  AnimationController? controller;
+  double? elevation;
+  Color? backgroundColor;
+  WidgetStatesController? internalStatesController;
+
+  void handleStatesControllerChange() {
+    // Force a rebuild to resolve WidgetStateProperty properties
+    setState(() {});
+  }
+
+  WidgetStatesController get statesController =>
+      widget.statesController ?? internalStatesController!;
+
+  void initStatesController() {
+    if (widget.statesController == null) {
+      internalStatesController = WidgetStatesController();
+    }
+    statesController
+      ..update(WidgetState.disabled, !widget.enabled)
+      ..addListener(handleStatesControllerChange);
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    initStatesController();
+  }
+
+  @override
+  void didUpdateWidget(ButtonStyleButton oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (widget.statesController != oldWidget.statesController) {
+      oldWidget.statesController?.removeListener(handleStatesControllerChange);
+      if (widget.statesController != null) {
+        internalStatesController?.dispose();
+        internalStatesController = null;
+      }
+      initStatesController();
+    }
+    if (widget.enabled != oldWidget.enabled) {
+      statesController.update(WidgetState.disabled, !widget.enabled);
+      if (!widget.enabled) {
+        // The button may have been disabled while a press gesture is currently underway.
+        statesController.update(WidgetState.pressed, false);
+      }
+    }
+  }
+
+  @override
+  void dispose() {
+    statesController.removeListener(handleStatesControllerChange);
+    internalStatesController?.dispose();
+    controller?.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final ThemeData theme = Theme.of(context);
+    final IconThemeData iconTheme = IconTheme.of(context);
+    final ButtonStyle? widgetStyle = widget.style;
+    final ButtonStyle? themeStyle = widget.themeStyleOf(context);
+    final ButtonStyle defaultStyle = widget.defaultStyleOf(context);
+
+    T? effectiveValue<T>(T? Function(ButtonStyle? style) getProperty) {
+      final T? widgetValue = getProperty(widgetStyle);
+      final T? themeValue = getProperty(themeStyle);
+      final T? defaultValue = getProperty(defaultStyle);
+      return widgetValue ?? themeValue ?? defaultValue;
+    }
+
+    T? resolve<T>(
+      WidgetStateProperty<T>? Function(ButtonStyle? style) getProperty,
+    ) {
+      return effectiveValue((ButtonStyle? style) {
+        return getProperty(style)?.resolve(statesController.value);
+      });
+    }
+
+    Color? effectiveIconColor() {
+      return widgetStyle?.iconColor?.resolve(statesController.value) ??
+          themeStyle?.iconColor?.resolve(statesController.value) ??
+          widgetStyle?.foregroundColor?.resolve(statesController.value) ??
+          themeStyle?.foregroundColor?.resolve(statesController.value) ??
+          defaultStyle.iconColor?.resolve(statesController.value) ??
+          // Fallback to foregroundColor if iconColor is null.
+          defaultStyle.foregroundColor?.resolve(statesController.value);
+    }
+
+    final double? resolvedElevation = resolve<double?>(
+      (ButtonStyle? style) => style?.elevation,
+    );
+    final TextStyle? resolvedTextStyle = resolve<TextStyle?>(
+      (ButtonStyle? style) => style?.textStyle,
+    );
+    Color? resolvedBackgroundColor = resolve<Color?>(
+      (ButtonStyle? style) => style?.backgroundColor,
+    );
+    final Color? resolvedForegroundColor = resolve<Color?>(
+      (ButtonStyle? style) => style?.foregroundColor,
+    );
+    final Color? resolvedShadowColor = resolve<Color?>(
+      (ButtonStyle? style) => style?.shadowColor,
+    );
+    final Color? resolvedSurfaceTintColor = resolve<Color?>(
+      (ButtonStyle? style) => style?.surfaceTintColor,
+    );
+    final EdgeInsetsGeometry? resolvedPadding = resolve<EdgeInsetsGeometry?>(
+      (ButtonStyle? style) => style?.padding,
+    );
+    final Size? resolvedMinimumSize = resolve<Size?>(
+      (ButtonStyle? style) => style?.minimumSize,
+    );
+    final Size? resolvedFixedSize = resolve<Size?>(
+      (ButtonStyle? style) => style?.fixedSize,
+    );
+    final Size? resolvedMaximumSize = resolve<Size?>(
+      (ButtonStyle? style) => style?.maximumSize,
+    );
+    final Color? resolvedIconColor = effectiveIconColor();
+    final double? resolvedIconSize = resolve<double?>(
+      (ButtonStyle? style) => style?.iconSize,
+    );
+    final BorderSide? resolvedSide = resolve<BorderSide?>(
+      (ButtonStyle? style) => style?.side,
+    );
+    final OutlinedBorder? resolvedShape = resolve<OutlinedBorder?>(
+      (ButtonStyle? style) => style?.shape,
+    );
+
+    final WidgetStateMouseCursor mouseCursor = _MouseCursor(
+      (Set<WidgetState> states) => effectiveValue(
+        (ButtonStyle? style) => style?.mouseCursor?.resolve(states),
+      ),
+    );
+
+    final WidgetStateProperty<Color?> overlayColor =
+        WidgetStateProperty.resolveWith<Color?>(
+          (Set<WidgetState> states) => effectiveValue(
+            (ButtonStyle? style) => style?.overlayColor?.resolve(states),
+          ),
+        );
+
+    final VisualDensity? resolvedVisualDensity = effectiveValue(
+      (ButtonStyle? style) => style?.visualDensity,
+    );
+    final MaterialTapTargetSize? resolvedTapTargetSize = effectiveValue(
+      (ButtonStyle? style) => style?.tapTargetSize,
+    );
+    final Duration? resolvedAnimationDuration = effectiveValue(
+      (ButtonStyle? style) => style?.animationDuration,
+    );
+    final bool resolvedEnableFeedback =
+        effectiveValue((ButtonStyle? style) => style?.enableFeedback) ?? true;
+    final AlignmentGeometry? resolvedAlignment = effectiveValue(
+      (ButtonStyle? style) => style?.alignment,
+    );
+    final Offset densityAdjustment = resolvedVisualDensity!.baseSizeAdjustment;
+    final InteractiveInkFeatureFactory? resolvedSplashFactory = effectiveValue(
+      (ButtonStyle? style) => style?.splashFactory,
+    );
+    final ButtonLayerBuilder? resolvedBackgroundBuilder = effectiveValue(
+      (ButtonStyle? style) => style?.backgroundBuilder,
+    );
+    final ButtonLayerBuilder? resolvedForegroundBuilder = effectiveValue(
+      (ButtonStyle? style) => style?.foregroundBuilder,
+    );
+
+    final Clip effectiveClipBehavior =
+        widget.clipBehavior ??
+        ((resolvedBackgroundBuilder ?? resolvedForegroundBuilder) != null
+            ? Clip.antiAlias
+            : Clip.none);
+
+    BoxConstraints effectiveConstraints = resolvedVisualDensity
+        .effectiveConstraints(
+          BoxConstraints(
+            minWidth: resolvedMinimumSize!.width,
+            minHeight: resolvedMinimumSize.height,
+            maxWidth: resolvedMaximumSize!.width,
+            maxHeight: resolvedMaximumSize.height,
+          ),
+        );
+    if (resolvedFixedSize != null) {
+      final Size size = effectiveConstraints.constrain(resolvedFixedSize);
+      if (size.width.isFinite) {
+        effectiveConstraints = effectiveConstraints.copyWith(
+          minWidth: size.width,
+          maxWidth: size.width,
+        );
+      }
+      if (size.height.isFinite) {
+        effectiveConstraints = effectiveConstraints.copyWith(
+          minHeight: size.height,
+          maxHeight: size.height,
+        );
+      }
+    }
+
+    // Per the Material Design team: don't allow the VisualDensity
+    // adjustment to reduce the width of the left/right padding. If we
+    // did, VisualDensity.compact, the default for desktop/web, would
+    // reduce the horizontal padding to zero.
+    final double dy = densityAdjustment.dy;
+    final double dx = math.max(0, densityAdjustment.dx);
+    final EdgeInsetsGeometry padding = resolvedPadding!
+        .add(EdgeInsets.fromLTRB(dx, dy, dx, dy))
+        .clamp(EdgeInsets.zero, EdgeInsetsGeometry.infinity);
+
+    // If an opaque button's background is becoming translucent while its
+    // elevation is changing, change the elevation first. Material implicitly
+    // animates its elevation but not its color. SKIA renders non-zero
+    // elevations as a shadow colored fill behind the Material's background.
+    if (resolvedAnimationDuration! > Duration.zero &&
+        elevation != null &&
+        backgroundColor != null &&
+        elevation != resolvedElevation &&
+        backgroundColor!.value != resolvedBackgroundColor!.value &&
+        backgroundColor!.opacity == 1 &&
+        resolvedBackgroundColor.opacity < 1 &&
+        resolvedElevation == 0) {
+      if (controller?.duration != resolvedAnimationDuration) {
+        controller?.dispose();
+        controller =
+            AnimationController(
+              duration: resolvedAnimationDuration,
+              vsync: this,
+            )..addStatusListener((AnimationStatus status) {
+              if (status == AnimationStatus.completed) {
+                setState(() {}); // Rebuild with the final background color.
+              }
+            });
+      }
+      resolvedBackgroundColor =
+          backgroundColor; // Defer changing the background color.
+      controller!.value = 0;
+      controller!.forward();
+    }
+    elevation = resolvedElevation;
+    backgroundColor = resolvedBackgroundColor;
+
+    Widget result = Padding(
+      padding: padding,
+      child: Align(
+        alignment: resolvedAlignment!,
+        widthFactor: 1.0,
+        heightFactor: 1.0,
+        child: resolvedForegroundBuilder != null
+            ? resolvedForegroundBuilder(
+                context,
+                statesController.value,
+                widget.child,
+              )
+            : widget.child,
+      ),
+    );
+    if (resolvedBackgroundBuilder != null) {
+      result = resolvedBackgroundBuilder(
+        context,
+        statesController.value,
+        result,
+      );
+    }
+
+    result = AnimatedTheme(
+      duration: resolvedAnimationDuration,
+      data: theme.copyWith(
+        iconTheme: iconTheme.merge(
+          IconThemeData(color: resolvedIconColor, size: resolvedIconSize),
+        ),
+      ),
+      child: InkWell(
+        onTap: widget.onPressed,
+        onLongPress: widget.onLongPress,
+        onHover: widget.onHover,
+        mouseCursor: mouseCursor,
+        enableFeedback: resolvedEnableFeedback,
+        focusNode: widget.focusNode,
+        canRequestFocus: widget.enabled,
+        onFocusChange: widget.onFocusChange,
+        autofocus: widget.autofocus,
+        splashFactory: resolvedSplashFactory,
+        overlayColor: overlayColor,
+        highlightColor: Colors.transparent,
+        customBorder: resolvedShape!.copyWith(side: resolvedSide),
+        statesController: statesController,
+        child: result,
+      ),
+    );
+
+    if (widget.tooltip != null) {
+      result = Tooltip(message: widget.tooltip, child: result);
+    }
+
+    final Size minSize;
+    switch (resolvedTapTargetSize!) {
+      case MaterialTapTargetSize.padded:
+        minSize = Size(
+          kMinInteractiveDimension + densityAdjustment.dx,
+          kMinInteractiveDimension + densityAdjustment.dy,
+        );
+        assert(minSize.width >= 0.0);
+        assert(minSize.height >= 0.0);
+      case MaterialTapTargetSize.shrinkWrap:
+        minSize = Size.zero;
+    }
+
+    return Semantics(
+      container: true,
+      button: widget.isSemanticButton,
+      enabled: widget.enabled,
+      child: _InputPadding(
+        minSize: minSize,
+        child: ConstrainedBox(
+          constraints: effectiveConstraints,
+          child: Material(
+            elevation: resolvedElevation!,
+            textStyle: resolvedTextStyle?.copyWith(
+              color: resolvedForegroundColor,
+            ),
+            shape: resolvedShape.copyWith(side: resolvedSide),
+            color: resolvedBackgroundColor,
+            shadowColor: resolvedShadowColor,
+            surfaceTintColor: resolvedSurfaceTintColor,
+            type: resolvedBackgroundColor == null
+                ? MaterialType.transparency
+                : MaterialType.button,
+            animationDuration: resolvedAnimationDuration,
+            clipBehavior: effectiveClipBehavior,
+            borderOnForeground: false,
+            child: result,
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+class _MouseCursor extends WidgetStateMouseCursor {
+  const _MouseCursor(this.resolveCallback);
+
+  final WidgetPropertyResolver<MouseCursor?> resolveCallback;
+
+  @override
+  MouseCursor resolve(Set<WidgetState> states) => resolveCallback(states)!;
+
+  @override
+  String get debugDescription => 'ButtonStyleButton_MouseCursor';
+}
+
+/// A widget to pad the area around a [ButtonStyleButton]'s inner [Material].
+///
+/// Redirect taps that occur in the padded area around the child to the center
+/// of the child. This increases the size of the button and the button's
+/// "tap target", but not its material or its ink splashes.
+class _InputPadding extends SingleChildRenderObjectWidget {
+  const _InputPadding({super.child, required this.minSize});
+
+  final Size minSize;
+
+  @override
+  RenderObject createRenderObject(BuildContext context) {
+    return _RenderInputPadding(minSize);
+  }
+
+  @override
+  void updateRenderObject(
+    BuildContext context,
+    covariant _RenderInputPadding renderObject,
+  ) {
+    renderObject.minSize = minSize;
+  }
+}
+
+class _RenderInputPadding extends RenderShiftedBox {
+  _RenderInputPadding(this._minSize, [RenderBox? child]) : super(child);
+
+  Size get minSize => _minSize;
+  Size _minSize;
+  set minSize(Size value) {
+    if (_minSize == value) {
+      return;
+    }
+    _minSize = value;
+    markNeedsLayout();
+  }
+
+  @override
+  double computeMinIntrinsicWidth(double height) {
+    if (child != null) {
+      return math.max(child!.getMinIntrinsicWidth(height), minSize.width);
+    }
+    return 0.0;
+  }
+
+  @override
+  double computeMinIntrinsicHeight(double width) {
+    if (child != null) {
+      return math.max(child!.getMinIntrinsicHeight(width), minSize.height);
+    }
+    return 0.0;
+  }
+
+  @override
+  double computeMaxIntrinsicWidth(double height) {
+    if (child != null) {
+      return math.max(child!.getMaxIntrinsicWidth(height), minSize.width);
+    }
+    return 0.0;
+  }
+
+  @override
+  double computeMaxIntrinsicHeight(double width) {
+    if (child != null) {
+      return math.max(child!.getMaxIntrinsicHeight(width), minSize.height);
+    }
+    return 0.0;
+  }
+
+  Size _computeSize({
+    required BoxConstraints constraints,
+    required ChildLayouter layoutChild,
+  }) {
+    if (child != null) {
+      final Size childSize = layoutChild(child!, constraints);
+      final double height = math.max(childSize.width, minSize.width);
+      final double width = math.max(childSize.height, minSize.height);
+      return constraints.constrain(Size(height, width));
+    }
+    return Size.zero;
+  }
+
+  @override
+  Size computeDryLayout(BoxConstraints constraints) {
+    return _computeSize(
+      constraints: constraints,
+      layoutChild: ChildLayoutHelper.dryLayoutChild,
+    );
+  }
+
+  @override
+  double? computeDryBaseline(
+    covariant BoxConstraints constraints,
+    TextBaseline baseline,
+  ) {
+    final RenderBox? child = this.child;
+    if (child == null) {
+      return null;
+    }
+    final double? result = child.getDryBaseline(constraints, baseline);
+    if (result == null) {
+      return null;
+    }
+    final Size childSize = child.getDryLayout(constraints);
+    return result +
+        Alignment.center
+            .alongOffset(getDryLayout(constraints) - childSize as Offset)
+            .dy;
+  }
+
+  @override
+  void performLayout() {
+    size = _computeSize(
+      constraints: constraints,
+      layoutChild: ChildLayoutHelper.layoutChild,
+    );
+    if (child != null) {
+      final BoxParentData childParentData = child!.parentData! as BoxParentData;
+      childParentData.offset = Alignment.center.alongOffset(
+        size - child!.size as Offset,
+      );
+    }
+  }
+
+  @override
+  bool hitTest(BoxHitTestResult result, {required Offset position}) {
+    if (super.hitTest(result, position: position)) {
+      return true;
+    }
+    final Offset center = child!.size.center(Offset.zero);
+    return result.addWithRawTransform(
+      transform: MatrixUtils.forceToPoint(center),
+      position: center,
+      hitTest: (BoxHitTestResult result, Offset position) {
+        assert(position == center);
+        return child!.hitTest(result, position: center);
+      },
+    );
+  }
+}

lib/common/widgets/dyn/text_button.dart

@@ -0,0 +1,676 @@
+// Copyright 2014 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// ignore_for_file: uri_does_not_exist_in_doc_import
+
+/// @docImport 'elevated_button.dart';
+/// @docImport 'filled_button.dart';
+/// @docImport 'material.dart';
+/// @docImport 'outlined_button.dart';
+library;
+
+import 'dart:ui' show lerpDouble;
+
+import 'package:PiliPlus/common/widgets/dyn/button.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart' hide InkWell, ButtonStyleButton;
+
+/// A Material Design "Text Button".
+///
+/// Use text buttons on toolbars, in dialogs, or inline with other
+/// content but offset from that content with padding so that the
+/// button's presence is obvious. Text buttons do not have visible
+/// borders and must therefore rely on their position relative to
+/// other content for context. In dialogs and cards, they should be
+/// grouped together in one of the bottom corners. Avoid using text
+/// buttons where they would blend in with other content, for example
+/// in the middle of lists.
+///
+/// A text button is a label [child] displayed on a (zero elevation)
+/// [Material] widget. The label's [Text] and [Icon] widgets are
+/// displayed in the [style]'s [ButtonStyle.foregroundColor]. The
+/// button reacts to touches by filling with the [style]'s
+/// [ButtonStyle.backgroundColor].
+///
+/// The text button's default style is defined by [defaultStyleOf].
+/// The style of this text button can be overridden with its [style]
+/// parameter. The style of all text buttons in a subtree can be
+/// overridden with the [TextButtonTheme] and the style of all of the
+/// text buttons in an app can be overridden with the [Theme]'s
+/// [ThemeData.textButtonTheme] property.
+///
+/// The static [styleFrom] method is a convenient way to create a
+/// text button [ButtonStyle] from simple values.
+///
+/// If the [onPressed] and [onLongPress] callbacks are null, then this
+/// button will be disabled, it will not react to touch.
+///
+/// {@tool dartpad}
+/// This sample shows various ways to configure TextButtons, from the
+/// simplest default appearance to versions that don't resemble
+/// Material Design at all.
+///
+/// ** See code in examples/api/lib/material/text_button/text_button.0.dart **
+/// {@end-tool}
+///
+/// {@tool dartpad}
+/// This sample demonstrates using the [statesController] parameter to create a button
+/// that adds support for [WidgetState.selected].
+///
+/// ** See code in examples/api/lib/material/text_button/text_button.1.dart **
+/// {@end-tool}
+///
+/// See also:
+///
+///  * [ElevatedButton], a filled button whose material elevates when pressed.
+///  * [FilledButton], a filled button that doesn't elevate when pressed.
+///  * [FilledButton.tonal], a filled button variant that uses a secondary fill color.
+///  * [OutlinedButton], a button with an outlined border and no fill color.
+///  * <https://material.io/design/components/buttons.html>
+///  * <https://m3.material.io/components/buttons>
+class TextButton extends ButtonStyleButton {
+  /// Create a [TextButton].
+  const TextButton({
+    super.key,
+    required super.onPressed,
+    super.onLongPress,
+    super.onHover,
+    super.onFocusChange,
+    super.style,
+    super.focusNode,
+    super.autofocus = false,
+    super.clipBehavior,
+    super.statesController,
+    super.isSemanticButton,
+    required Widget super.child,
+  });
+
+  /// Create a text button from a pair of widgets that serve as the button's
+  /// [icon] and [label].
+  ///
+  /// The icon and label are arranged in a row and padded by 8 logical pixels
+  /// at the ends, with an 8 pixel gap in between.
+  ///
+  /// If [icon] is null, will create a [TextButton] instead.
+  ///
+  /// {@macro flutter.material.ButtonStyleButton.iconAlignment}
+  ///
+  factory TextButton.icon({
+    Key? key,
+    required VoidCallback? onPressed,
+    VoidCallback? onLongPress,
+    ValueChanged<bool>? onHover,
+    ValueChanged<bool>? onFocusChange,
+    ButtonStyle? style,
+    FocusNode? focusNode,
+    bool? autofocus,
+    Clip? clipBehavior,
+    WidgetStatesController? statesController,
+    Widget? icon,
+    required Widget label,
+    IconAlignment? iconAlignment,
+  }) {
+    if (icon == null) {
+      return TextButton(
+        key: key,
+        onPressed: onPressed,
+        onLongPress: onLongPress,
+        onHover: onHover,
+        onFocusChange: onFocusChange,
+        style: style,
+        focusNode: focusNode,
+        autofocus: autofocus ?? false,
+        clipBehavior: clipBehavior ?? Clip.none,
+        statesController: statesController,
+        child: label,
+      );
+    }
+    return _TextButtonWithIcon(
+      key: key,
+      onPressed: onPressed,
+      onLongPress: onLongPress,
+      onHover: onHover,
+      onFocusChange: onFocusChange,
+      style: style,
+      focusNode: focusNode,
+      autofocus: autofocus ?? false,
+      clipBehavior: clipBehavior ?? Clip.none,
+      statesController: statesController,
+      icon: icon,
+      label: label,
+      iconAlignment: iconAlignment,
+    );
+  }
+
+  /// A static convenience method that constructs a text button
+  /// [ButtonStyle] given simple values.
+  ///
+  /// The [foregroundColor] and [disabledForegroundColor] colors are used
+  /// to create a [WidgetStateProperty] [ButtonStyle.foregroundColor], and
+  /// a derived [ButtonStyle.overlayColor] if [overlayColor] isn't specified.
+  ///
+  /// The [backgroundColor] and [disabledBackgroundColor] colors are
+  /// used to create a [WidgetStateProperty] [ButtonStyle.backgroundColor].
+  ///
+  /// Similarly, the [enabledMouseCursor] and [disabledMouseCursor]
+  /// parameters are used to construct [ButtonStyle.mouseCursor].
+  ///
+  /// The [iconColor], [disabledIconColor] are used to construct
+  /// [ButtonStyle.iconColor] and [iconSize] is used to construct
+  /// [ButtonStyle.iconSize].
+  ///
+  /// If [iconColor] is null, the button icon will use [foregroundColor]. If [foregroundColor] is also
+  /// null, the button icon will use the default icon color.
+  ///
+  /// If [overlayColor] is specified and its value is [Colors.transparent]
+  /// then the pressed/focused/hovered highlights are effectively defeated.
+  /// Otherwise a [WidgetStateProperty] with the same opacities as the
+  /// default is created.
+  ///
+  /// All of the other parameters are either used directly or used to
+  /// create a [WidgetStateProperty] with a single value for all
+  /// states.
+  ///
+  /// All parameters default to null. By default this method returns
+  /// a [ButtonStyle] that doesn't override anything.
+  ///
+  /// For example, to override the default text and icon colors for a
+  /// [TextButton], as well as its overlay color, with all of the
+  /// standard opacity adjustments for the pressed, focused, and
+  /// hovered states, one could write:
+  ///
+  /// ```dart
+  /// TextButton(
+  ///   style: TextButton.styleFrom(foregroundColor: Colors.green),
+  ///   child: const Text('Give Kate a mix tape'),
+  ///   onPressed: () {
+  ///     // ...
+  ///   },
+  /// ),
+  /// ```
+  static ButtonStyle styleFrom({
+    Color? foregroundColor,
+    Color? backgroundColor,
+    Color? disabledForegroundColor,
+    Color? disabledBackgroundColor,
+    Color? shadowColor,
+    Color? surfaceTintColor,
+    Color? iconColor,
+    double? iconSize,
+    IconAlignment? iconAlignment,
+    Color? disabledIconColor,
+    Color? overlayColor,
+    double? elevation,
+    TextStyle? textStyle,
+    EdgeInsetsGeometry? padding,
+    Size? minimumSize,
+    Size? fixedSize,
+    Size? maximumSize,
+    BorderSide? side,
+    OutlinedBorder? shape,
+    MouseCursor? enabledMouseCursor,
+    MouseCursor? disabledMouseCursor,
+    VisualDensity? visualDensity,
+    MaterialTapTargetSize? tapTargetSize,
+    Duration? animationDuration,
+    bool? enableFeedback,
+    AlignmentGeometry? alignment,
+    InteractiveInkFeatureFactory? splashFactory,
+    ButtonLayerBuilder? backgroundBuilder,
+    ButtonLayerBuilder? foregroundBuilder,
+  }) {
+    final WidgetStateProperty<Color?>? backgroundColorProp = switch ((
+      backgroundColor,
+      disabledBackgroundColor,
+    )) {
+      (_?, null) => WidgetStatePropertyAll<Color?>(backgroundColor),
+      (_, _) => ButtonStyleButton.defaultColor(
+        backgroundColor,
+        disabledBackgroundColor,
+      ),
+    };
+    final WidgetStateProperty<Color?>? iconColorProp = switch ((
+      iconColor,
+      disabledIconColor,
+    )) {
+      (_?, null) => WidgetStatePropertyAll<Color?>(iconColor),
+      (_, _) => ButtonStyleButton.defaultColor(iconColor, disabledIconColor),
+    };
+    final WidgetStateProperty<Color?>? overlayColorProp = switch ((
+      foregroundColor,
+      overlayColor,
+    )) {
+      (null, null) => null,
+      (_, Color(a: 0.0)) => WidgetStatePropertyAll<Color?>(overlayColor),
+      (_, final Color color) || (final Color color, _) =>
+        WidgetStateProperty<Color?>.fromMap(<WidgetState, Color?>{
+          WidgetState.pressed: color.withValues(alpha: 0.1),
+          WidgetState.hovered: color.withValues(alpha: 0.08),
+          WidgetState.focused: color.withValues(alpha: 0.1),
+        }),
+    };
+
+    return ButtonStyle(
+      textStyle: ButtonStyleButton.allOrNull<TextStyle>(textStyle),
+      foregroundColor: ButtonStyleButton.defaultColor(
+        foregroundColor,
+        disabledForegroundColor,
+      ),
+      backgroundColor: backgroundColorProp,
+      overlayColor: overlayColorProp,
+      shadowColor: ButtonStyleButton.allOrNull<Color>(shadowColor),
+      surfaceTintColor: ButtonStyleButton.allOrNull<Color>(surfaceTintColor),
+      iconColor: iconColorProp,
+      iconSize: ButtonStyleButton.allOrNull<double>(iconSize),
+      iconAlignment: iconAlignment,
+      elevation: ButtonStyleButton.allOrNull<double>(elevation),
+      padding: ButtonStyleButton.allOrNull<EdgeInsetsGeometry>(padding),
+      minimumSize: ButtonStyleButton.allOrNull<Size>(minimumSize),
+      fixedSize: ButtonStyleButton.allOrNull<Size>(fixedSize),
+      maximumSize: ButtonStyleButton.allOrNull<Size>(maximumSize),
+      side: ButtonStyleButton.allOrNull<BorderSide>(side),
+      shape: ButtonStyleButton.allOrNull<OutlinedBorder>(shape),
+      mouseCursor: WidgetStateProperty<MouseCursor?>.fromMap(
+        <WidgetStatesConstraint, MouseCursor?>{
+          WidgetState.disabled: disabledMouseCursor,
+          WidgetState.any: enabledMouseCursor,
+        },
+      ),
+      visualDensity: visualDensity,
+      tapTargetSize: tapTargetSize,
+      animationDuration: animationDuration,
+      enableFeedback: enableFeedback,
+      alignment: alignment,
+      splashFactory: splashFactory,
+      backgroundBuilder: backgroundBuilder,
+      foregroundBuilder: foregroundBuilder,
+    );
+  }
+
+  /// Defines the button's default appearance.
+  ///
+  /// {@template flutter.material.text_button.default_style_of}
+  /// The button [child]'s [Text] and [Icon] widgets are rendered with
+  /// the [ButtonStyle]'s foreground color. The button's [InkWell] adds
+  /// the style's overlay color when the button is focused, hovered
+  /// or pressed. The button's background color becomes its [Material]
+  /// color and is transparent by default.
+  ///
+  /// All of the [ButtonStyle]'s defaults appear below.
+  ///
+  /// In this list "Theme.foo" is shorthand for
+  /// `Theme.of(context).foo`. Color scheme values like
+  /// "onSurface(0.38)" are shorthand for
+  /// `onSurface.withValues(alpha: 0.38)`. [WidgetStateProperty] valued
+  /// properties that are not followed by a sublist have the same
+  /// value for all states, otherwise the values are as specified for
+  /// each state and "others" means all other states.
+  ///
+  /// The "default font size" below refers to the font size specified in the
+  /// [defaultStyleOf] method (or 14.0 if unspecified), scaled by the
+  /// `MediaQuery.textScalerOf(context).scale` method. And the names of the
+  /// EdgeInsets constructors and `EdgeInsetsGeometry.lerp` have been abbreviated
+  /// for readability.
+  ///
+  /// The color of the [ButtonStyle.textStyle] is not used, the
+  /// [ButtonStyle.foregroundColor] color is used instead.
+  /// {@endtemplate}
+  ///
+  /// ## Material 2 defaults
+  ///
+  /// * `textStyle` - Theme.textTheme.button
+  /// * `backgroundColor` - transparent
+  /// * `foregroundColor`
+  ///   * disabled - Theme.colorScheme.onSurface(0.38)
+  ///   * others - Theme.colorScheme.primary
+  /// * `overlayColor`
+  ///   * hovered - Theme.colorScheme.primary(0.08)
+  ///   * focused or pressed - Theme.colorScheme.primary(0.12)
+  /// * `shadowColor` - Theme.shadowColor
+  /// * `elevation` - 0
+  /// * `padding`
+  ///   * `default font size <= 14` - (horizontal(12), vertical(8))
+  ///   * `14 < default font size <= 28` - lerp(all(8), horizontal(8))
+  ///   * `28 < default font size <= 36` - lerp(horizontal(8), horizontal(4))
+  ///   * `36 < default font size` - horizontal(4)
+  /// * `minimumSize` - Size(64, 36)
+  /// * `fixedSize` - null
+  /// * `maximumSize` - Size.infinite
+  /// * `side` - null
+  /// * `shape` - RoundedRectangleBorder(borderRadius: BorderRadius.circular(4))
+  /// * `mouseCursor`
+  ///   * disabled - SystemMouseCursors.basic
+  ///   * others - SystemMouseCursors.click
+  /// * `visualDensity` - theme.visualDensity
+  /// * `tapTargetSize` - theme.materialTapTargetSize
+  /// * `animationDuration` - kThemeChangeDuration
+  /// * `enableFeedback` - true
+  /// * `alignment` - Alignment.center
+  /// * `splashFactory` - InkRipple.splashFactory
+  ///
+  /// The default padding values for the [TextButton.icon] factory are slightly different:
+  ///
+  /// * `padding`
+  ///   * `default font size <= 14` - all(8)
+  ///   * `14 < default font size <= 28 `- lerp(all(8), horizontal(4))
+  ///   * `28 < default font size` - horizontal(4)
+  ///
+  /// The default value for `side`, which defines the appearance of the button's
+  /// outline, is null. That means that the outline is defined by the button
+  /// shape's [OutlinedBorder.side]. Typically the default value of an
+  /// [OutlinedBorder]'s side is [BorderSide.none], so an outline is not drawn.
+  ///
+  /// ## Material 3 defaults
+  ///
+  /// If [ThemeData.useMaterial3] is set to true the following defaults will
+  /// be used:
+  ///
+  /// {@template flutter.material.text_button.material3_defaults}
+  /// * `textStyle` - Theme.textTheme.labelLarge
+  /// * `backgroundColor` - transparent
+  /// * `foregroundColor`
+  ///   * disabled - Theme.colorScheme.onSurface(0.38)
+  ///   * others - Theme.colorScheme.primary
+  /// * `overlayColor`
+  ///   * hovered - Theme.colorScheme.primary(0.08)
+  ///   * focused or pressed - Theme.colorScheme.primary(0.1)
+  ///   * others - null
+  /// * `shadowColor` - Colors.transparent,
+  /// * `surfaceTintColor` - null
+  /// * `elevation` - 0
+  /// * `padding`
+  ///   * `default font size <= 14` - lerp(horizontal(12), horizontal(4))
+  ///   * `14 < default font size <= 28` - lerp(all(8), horizontal(8))
+  ///   * `28 < default font size <= 36` - lerp(horizontal(8), horizontal(4))
+  ///   * `36 < default font size` - horizontal(4)
+  /// * `minimumSize` - Size(64, 40)
+  /// * `fixedSize` - null
+  /// * `maximumSize` - Size.infinite
+  /// * `side` - null
+  /// * `shape` - StadiumBorder()
+  /// * `mouseCursor`
+  ///   * disabled - SystemMouseCursors.basic
+  ///   * others - SystemMouseCursors.click
+  /// * `visualDensity` - theme.visualDensity
+  /// * `tapTargetSize` - theme.materialTapTargetSize
+  /// * `animationDuration` - kThemeChangeDuration
+  /// * `enableFeedback` - true
+  /// * `alignment` - Alignment.center
+  /// * `splashFactory` - Theme.splashFactory
+  ///
+  /// For the [TextButton.icon] factory, the end (generally the right) value of
+  /// `padding` is increased from 12 to 16.
+  /// {@endtemplate}
+  @override
+  ButtonStyle defaultStyleOf(BuildContext context) {
+    final ThemeData theme = Theme.of(context);
+    final ColorScheme colorScheme = theme.colorScheme;
+
+    return Theme.of(context).useMaterial3
+        ? _TextButtonDefaultsM3(context)
+        : styleFrom(
+            foregroundColor: colorScheme.primary,
+            disabledForegroundColor: colorScheme.onSurface.withValues(
+              alpha: 0.38,
+            ),
+            backgroundColor: Colors.transparent,
+            disabledBackgroundColor: Colors.transparent,
+            shadowColor: theme.shadowColor,
+            elevation: 0,
+            textStyle: theme.textTheme.labelLarge,
+            padding: _scaledPadding(context),
+            minimumSize: const Size(64, 36),
+            maximumSize: Size.infinite,
+            shape: const RoundedRectangleBorder(
+              borderRadius: BorderRadius.all(Radius.circular(4)),
+            ),
+            enabledMouseCursor: SystemMouseCursors.click,
+            disabledMouseCursor: SystemMouseCursors.basic,
+            visualDensity: theme.visualDensity,
+            tapTargetSize: theme.materialTapTargetSize,
+            animationDuration: kThemeChangeDuration,
+            enableFeedback: true,
+            alignment: Alignment.center,
+            splashFactory: InkRipple.splashFactory,
+          );
+  }
+
+  /// Returns the [TextButtonThemeData.style] of the closest
+  /// [TextButtonTheme] ancestor.
+  @override
+  ButtonStyle? themeStyleOf(BuildContext context) {
+    return TextButtonTheme.of(context).style;
+  }
+}
+
+EdgeInsetsGeometry _scaledPadding(BuildContext context) {
+  final ThemeData theme = Theme.of(context);
+  final double defaultFontSize = theme.textTheme.labelLarge?.fontSize ?? 14.0;
+  final double effectiveTextScale =
+      MediaQuery.textScalerOf(context).scale(defaultFontSize) / 14.0;
+  return ButtonStyleButton.scaledPadding(
+    theme.useMaterial3
+        ? const EdgeInsets.symmetric(horizontal: 12, vertical: 8)
+        : const EdgeInsets.all(8),
+    const EdgeInsets.symmetric(horizontal: 8),
+    const EdgeInsets.symmetric(horizontal: 4),
+    effectiveTextScale,
+  );
+}
+
+class _TextButtonWithIcon extends TextButton {
+  _TextButtonWithIcon({
+    super.key,
+    required super.onPressed,
+    super.onLongPress,
+    super.onHover,
+    super.onFocusChange,
+    super.style,
+    super.focusNode,
+    bool? autofocus,
+    super.clipBehavior,
+    super.statesController,
+    required Widget icon,
+    required Widget label,
+    IconAlignment? iconAlignment,
+  }) : super(
+         autofocus: autofocus ?? false,
+         child: _TextButtonWithIconChild(
+           icon: icon,
+           label: label,
+           buttonStyle: style,
+           iconAlignment: iconAlignment,
+         ),
+       );
+
+  @override
+  ButtonStyle defaultStyleOf(BuildContext context) {
+    final bool useMaterial3 = Theme.of(context).useMaterial3;
+    final ButtonStyle buttonStyle = super.defaultStyleOf(context);
+    final double defaultFontSize =
+        buttonStyle.textStyle?.resolve(const <WidgetState>{})?.fontSize ?? 14.0;
+    final double effectiveTextScale =
+        MediaQuery.textScalerOf(context).scale(defaultFontSize) / 14.0;
+    final EdgeInsetsGeometry scaledPadding = ButtonStyleButton.scaledPadding(
+      useMaterial3
+          ? const EdgeInsetsDirectional.fromSTEB(12, 8, 16, 8)
+          : const EdgeInsets.all(8),
+      const EdgeInsets.symmetric(horizontal: 4),
+      const EdgeInsets.symmetric(horizontal: 4),
+      effectiveTextScale,
+    );
+    return buttonStyle.copyWith(
+      padding: WidgetStatePropertyAll<EdgeInsetsGeometry>(scaledPadding),
+    );
+  }
+}
+
+class _TextButtonWithIconChild extends StatelessWidget {
+  const _TextButtonWithIconChild({
+    required this.label,
+    required this.icon,
+    required this.buttonStyle,
+    required this.iconAlignment,
+  });
+
+  final Widget label;
+  final Widget icon;
+  final ButtonStyle? buttonStyle;
+  final IconAlignment? iconAlignment;
+
+  @override
+  Widget build(BuildContext context) {
+    final double defaultFontSize =
+        buttonStyle?.textStyle?.resolve(const <WidgetState>{})?.fontSize ??
+        14.0;
+    final double scale =
+        clampDouble(
+          MediaQuery.textScalerOf(context).scale(defaultFontSize) / 14.0,
+          1.0,
+          2.0,
+        ) -
+        1.0;
+    final TextButtonThemeData textButtonTheme = TextButtonTheme.of(context);
+    final IconAlignment effectiveIconAlignment =
+        iconAlignment ??
+        textButtonTheme.style?.iconAlignment ??
+        buttonStyle?.iconAlignment ??
+        IconAlignment.start;
+    return Row(
+      mainAxisSize: MainAxisSize.min,
+      spacing: lerpDouble(8, 4, scale)!,
+      children: effectiveIconAlignment == IconAlignment.start
+          ? <Widget>[icon, Flexible(child: label)]
+          : <Widget>[Flexible(child: label), icon],
+    );
+  }
+}
+
+// BEGIN GENERATED TOKEN PROPERTIES - TextButton
+
+// Do not edit by hand. The code between the "BEGIN GENERATED" and
+// "END GENERATED" comments are generated from data in the Material
+// Design token database by the script:
+//   dev/tools/gen_defaults/bin/gen_defaults.dart.
+
+// dart format off
+class _TextButtonDefaultsM3 extends ButtonStyle {
+  _TextButtonDefaultsM3(this.context)
+   : super(
+       animationDuration: kThemeChangeDuration,
+       enableFeedback: true,
+       alignment: Alignment.center,
+     );
+
+  final BuildContext context;
+  late final ColorScheme _colors = Theme.of(context).colorScheme;
+
+  @override
+  WidgetStateProperty<TextStyle?> get textStyle =>
+    WidgetStatePropertyAll<TextStyle?>(Theme.of(context).textTheme.labelLarge);
+
+  @override
+  WidgetStateProperty<Color?>? get backgroundColor =>
+    const WidgetStatePropertyAll<Color>(Colors.transparent);
+
+  @override
+  WidgetStateProperty<Color?>? get foregroundColor =>
+    WidgetStateProperty.resolveWith((Set<WidgetState> states) {
+      if (states.contains(WidgetState.disabled)) {
+        return _colors.onSurface.withValues(alpha: 0.38);
+      }
+      return _colors.primary;
+    });
+
+  @override
+  WidgetStateProperty<Color?>? get overlayColor =>
+    WidgetStateProperty.resolveWith((Set<WidgetState> states) {
+      if (states.contains(WidgetState.pressed)) {
+        return _colors.primary.withValues(alpha: 0.1);
+      }
+      if (states.contains(WidgetState.hovered)) {
+        return _colors.primary.withValues(alpha: 0.08);
+      }
+      if (states.contains(WidgetState.focused)) {
+        return _colors.primary.withValues(alpha: 0.1);
+      }
+      return null;
+    });
+
+  @override
+  WidgetStateProperty<Color>? get shadowColor =>
+    const WidgetStatePropertyAll<Color>(Colors.transparent);
+
+  @override
+  WidgetStateProperty<Color>? get surfaceTintColor =>
+    const WidgetStatePropertyAll<Color>(Colors.transparent);
+
+  @override
+  WidgetStateProperty<double>? get elevation =>
+    const WidgetStatePropertyAll<double>(0.0);
+
+  @override
+  WidgetStateProperty<EdgeInsetsGeometry>? get padding =>
+    WidgetStatePropertyAll<EdgeInsetsGeometry>(_scaledPadding(context));
+
+  @override
+  WidgetStateProperty<Size>? get minimumSize =>
+    const WidgetStatePropertyAll<Size>(Size(64.0, 40.0));
+
+  // No default fixedSize
+
+  @override
+  WidgetStateProperty<double>? get iconSize =>
+    const WidgetStatePropertyAll<double>(18.0);
+
+  @override
+  WidgetStateProperty<Color>? get iconColor {
+    return WidgetStateProperty.resolveWith((Set<WidgetState> states) {
+      if (states.contains(WidgetState.disabled)) {
+        return _colors.onSurface.withValues(alpha: 0.38);
+      }
+      if (states.contains(WidgetState.pressed)) {
+        return _colors.primary;
+      }
+      if (states.contains(WidgetState.hovered)) {
+        return _colors.primary;
+      }
+      if (states.contains(WidgetState.focused)) {
+        return _colors.primary;
+      }
+      return _colors.primary;
+    });
+  }
+
+  @override
+  WidgetStateProperty<Size>? get maximumSize =>
+    const WidgetStatePropertyAll<Size>(Size.infinite);
+
+  // No default side
+
+  @override
+  WidgetStateProperty<OutlinedBorder>? get shape =>
+    const WidgetStatePropertyAll<OutlinedBorder>(StadiumBorder());
+
+  @override
+  WidgetStateProperty<MouseCursor?>? get mouseCursor =>
+    WidgetStateProperty.resolveWith((Set<WidgetState> states) {
+      if (states.contains(WidgetState.disabled)) {
+        return SystemMouseCursors.basic;
+      }
+      return SystemMouseCursors.click;
+    });
+
+  @override
+  VisualDensity? get visualDensity => Theme.of(context).visualDensity;
+
+  @override
+  MaterialTapTargetSize? get tapTargetSize => Theme.of(context).materialTapTargetSize;
+
+  @override
+  InteractiveInkFeatureFactory? get splashFactory => Theme.of(context).splashFactory;
+}
+// dart format on
+
+// END GENERATED TOKEN PROPERTIES - TextButton

lib/common/widgets/dynamic_sliver_appbar_medium.dart

@@ -3,8 +3,8 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 
 /// https://github.com/flutter/flutter/issues/18345#issuecomment-1627644396
-class DynamicSliverAppBar extends StatefulWidget {
-  const DynamicSliverAppBar({
+class DynamicSliverAppBarMedium extends StatefulWidget {
+  const DynamicSliverAppBarMedium({
     this.flexibleSpace,
     super.key,
     this.leading,
@@ -35,7 +35,7 @@ class DynamicSliverAppBar extends StatefulWidget {
     this.stretchTriggerOffset = 100.0,
     this.onStretchTrigger,
     this.shape,
-    this.toolbarHeight = kToolbarHeight + 20,
+    this.toolbarHeight = kToolbarHeight,
     this.leadingWidth,
     this.toolbarTextStyle,
     this.titleTextStyle,
@@ -43,8 +43,10 @@ class DynamicSliverAppBar extends StatefulWidget {
     this.forceMaterialTransparency = false,
     this.clipBehavior,
     this.appBarClipper,
+    this.callback,
   });
 
+  final ValueChanged<double>? callback;
   final Widget? flexibleSpace;
   final Widget? leading;
   final bool automaticallyImplyLeading;
@@ -86,29 +88,16 @@ class DynamicSliverAppBar extends StatefulWidget {
   final CustomClipper<Path>? appBarClipper;
 
   @override
-  State<DynamicSliverAppBar> createState() => _DynamicSliverAppBarState();
+  State<DynamicSliverAppBarMedium> createState() =>
+      _DynamicSliverAppBarMediumState();
 }
 
-class _DynamicSliverAppBarState extends State<DynamicSliverAppBar> {
+class _DynamicSliverAppBarMediumState extends State<DynamicSliverAppBarMedium> {
   final GlobalKey _childKey = GlobalKey();
 
   // As long as the height is 0 instead of the sliver app bar a sliver to box adapter will be used
   // to calculate dynamically the size for the sliver app bar
   double _height = 0;
-  Orientation? _orientation;
-
-  @override
-  void initState() {
-    super.initState();
-    _updateHeight();
-  }
-
-  @override
-  void didUpdateWidget(covariant DynamicSliverAppBar oldWidget) {
-    super.didUpdateWidget(oldWidget);
-
-    _updateHeight();
-  }
 
   void _updateHeight() {
     // Gets the new height and updates the sliver app bar. Needs to be called after the last frame has been rebuild
@@ -119,28 +108,46 @@ class _DynamicSliverAppBarState extends State<DynamicSliverAppBar> {
         _height = (_childKey.currentContext!.findRenderObject()! as RenderBox)
             .size
             .height;
+        widget.callback?.call(_height);
       });
     });
   }
 
+  Orientation? _orientation;
+  late Size size;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    size = MediaQuery.sizeOf(context);
+    final orientation = size.width > size.height
+        ? Orientation.landscape
+        : Orientation.portrait;
+    if (orientation != _orientation) {
+      _orientation = orientation;
+      _height = 0;
+      _updateHeight();
+    }
+  }
+
   @override
   Widget build(BuildContext context) {
     //Needed to lay out the flexibleSpace the first time, so we can calculate its intrinsic height
-    Orientation orientation = MediaQuery.orientationOf(context);
-    if (_orientation != orientation) {
-      _orientation = orientation;
-      _height = 0;
-    }
     if (_height == 0) {
       return SliverToBoxAdapter(
-        child: Container(
-          key: _childKey,
-          child: widget.flexibleSpace ?? SizedBox(height: kToolbarHeight),
+        child: UnconstrainedBox(
+          alignment: Alignment.topLeft,
+          child: SizedBox(
+            key: _childKey,
+            width: size.width,
+            child: widget.flexibleSpace,
+          ),
         ),
       );
     }
 
-    return SliverAppBar(
+    final padding = MediaQuery.viewPaddingOf(context).top;
+    return SliverAppBar.medium(
       leading: widget.leading,
       automaticallyImplyLeading: widget.automaticallyImplyLeading,
       title: widget.title,
@@ -159,7 +166,6 @@ class _DynamicSliverAppBarState extends State<DynamicSliverAppBar> {
       centerTitle: widget.centerTitle,
       excludeHeaderSemantics: widget.excludeHeaderSemantics,
       titleSpacing: widget.titleSpacing,
-      collapsedHeight: widget.collapsedHeight,
       floating: widget.floating,
       pinned: widget.pinned,
       snap: widget.snap,
@@ -167,8 +173,9 @@ class _DynamicSliverAppBarState extends State<DynamicSliverAppBar> {
       stretchTriggerOffset: widget.stretchTriggerOffset,
       onStretchTrigger: widget.onStretchTrigger,
       shape: widget.shape,
-      toolbarHeight: widget.toolbarHeight,
-      expandedHeight: _height,
+      toolbarHeight: kToolbarHeight,
+      collapsedHeight: kToolbarHeight + padding + 1,
+      expandedHeight: _height - padding,
       leadingWidth: widget.leadingWidth,
       toolbarTextStyle: widget.toolbarTextStyle,
       titleTextStyle: widget.titleTextStyle,

lib/common/widgets/html_render.dart

@@ -1,131 +0,0 @@
-import 'package:PiliPlus/common/widgets/interactiveviewer_gallery/interactiveviewer_gallery.dart'
-    show SourceModel;
-import 'package:PiliPlus/utils/extension.dart';
-import 'package:flutter/material.dart';
-import 'package:flutter_html/flutter_html.dart';
-import 'network_img_layer.dart';
-
-Widget htmlRender({
-  required BuildContext context,
-  String? htmlContent,
-  int? imgCount,
-  List<String>? imgList,
-  required double constrainedWidth,
-  Function(List<String>, int)? callback,
-}) {
-  debugPrint('htmlRender');
-  return SelectionArea(
-      child: Html(
-    data: htmlContent,
-    onLinkTap: (String? url, Map<String, String> buildContext, attributes) {},
-    extensions: [
-      TagExtension(
-        tagsToExtend: <String>{'img'},
-        builder: (ExtensionContext extensionContext) {
-          try {
-            final Map<String, dynamic> attributes = extensionContext.attributes;
-            final List<dynamic> key = attributes.keys.toList();
-            String imgUrl = key.contains('src')
-                ? attributes['src'] as String
-                : attributes['data-src'] as String;
-            if (imgUrl.startsWith('//')) {
-              imgUrl = 'https:$imgUrl';
-            }
-            if (imgUrl.startsWith('http://')) {
-              imgUrl = imgUrl.replaceAll('http://', 'https://');
-            }
-            imgUrl = imgUrl.contains('@') ? imgUrl.split('@').first : imgUrl;
-            final bool isEmote = imgUrl.contains('/emote/');
-            final bool isMall = imgUrl.contains('/mall/');
-            if (isMall) {
-              return const SizedBox();
-            }
-            // bool inTable =
-            //     extensionContext.element!.previousElementSibling == null ||
-            //         extensionContext.element!.nextElementSibling == null;
-            // imgUrl = Utils().imageUrl(imgUrl!);
-            // return CachedNetworkImage(
-            //   imageUrl: imgUrl,
-            //   width: isEmote ? 22 : null,
-            //   height: isEmote ? 22 : null,
-            // );
-            return Hero(
-              tag: imgUrl,
-              child: GestureDetector(
-                onTap: () {
-                  if (callback != null) {
-                    callback([imgUrl], 0);
-                  } else {
-                    context.imageView(
-                      imgList: [SourceModel(url: imgUrl)],
-                    );
-                  }
-                },
-                child: NetworkImgLayer(
-                  width: isEmote ? 22 : constrainedWidth,
-                  height: isEmote ? 22 : 200,
-                  src: imgUrl,
-                  ignoreHeight: !isEmote,
-                ),
-              ),
-            );
-          } catch (err) {
-            return const SizedBox();
-          }
-        },
-      ),
-    ],
-    style: {
-      'html': Style(
-        fontSize: FontSize(16),
-        lineHeight: LineHeight.percent(160),
-        letterSpacing: 0.3,
-      ),
-      // 'br': Style(margin: Margins.zero, padding: HtmlPaddings.zero),
-      'body': Style(margin: Margins.zero, padding: HtmlPaddings.zero),
-      'a': Style(
-        color: Theme.of(context).colorScheme.primary,
-        textDecoration: TextDecoration.none,
-      ),
-      'br': Style(
-        lineHeight: LineHeight.percent(-1),
-      ),
-      'p': Style(
-        margin: Margins.only(bottom: 4),
-        // margin: Margins.zero,
-      ),
-      'span': Style(
-        fontSize: FontSize.large,
-        height: Height(1.8),
-      ),
-      'div': Style(height: Height.auto()),
-      'li > p': Style(
-        display: Display.inline,
-      ),
-      'li': Style(
-        padding: HtmlPaddings.only(bottom: 4),
-        textAlign: TextAlign.justify,
-      ),
-      'img': Style(margin: Margins.only(top: 4, bottom: 4)),
-      'h1,h2': Style(
-        fontSize: FontSize.xLarge,
-        fontWeight: FontWeight.bold,
-        margin: Margins.only(bottom: 8),
-      ),
-      'h3,h4,h5': Style(
-        fontSize: FontSize(16),
-        fontWeight: FontWeight.bold,
-        margin: Margins.only(bottom: 4),
-      ),
-      'figcaption': Style(
-        fontSize: FontSize.large,
-        textAlign: TextAlign.center,
-        // margin: Margins.only(top: 4),
-      ),
-      'strong': Style(fontWeight: FontWeight.bold),
-      'figure': Style(
-        margin: Margins.zero,
-      ),
-    },
-  ));
-}

lib/common/widgets/http_error.dart

@@ -1,72 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:flutter_svg/flutter_svg.dart';
-
-class HttpError extends StatelessWidget {
-  const HttpError({
-    this.isSliver = true,
-    this.errMsg,
-    this.callback,
-    this.btnText,
-    this.extraWidget,
-    super.key,
-  });
-
-  final bool isSliver;
-  final String? errMsg;
-  final Function()? callback;
-  final String? btnText;
-  final Widget? extraWidget;
-
-  @override
-  Widget build(BuildContext context) {
-    return isSliver
-        ? SliverToBoxAdapter(child: content(context))
-        : SizedBox(
-            width: double.infinity,
-            child: content(context),
-          );
-  }
-
-  Widget content(BuildContext context) => Column(
-        mainAxisSize: MainAxisSize.min,
-        crossAxisAlignment: CrossAxisAlignment.center,
-        mainAxisAlignment: MainAxisAlignment.center,
-        children: [
-          const SizedBox(height: 40),
-          SvgPicture.asset(
-            "assets/images/error.svg",
-            height: 200,
-          ),
-          const SizedBox(height: 30),
-          Padding(
-            padding: const EdgeInsets.symmetric(horizontal: 16),
-            child: SelectableText(
-              errMsg ?? '没有数据',
-              textAlign: TextAlign.center,
-              style: Theme.of(context).textTheme.titleSmall,
-            ),
-          ),
-          if (extraWidget != null) ...[
-            const SizedBox(height: 10),
-            extraWidget!,
-            const SizedBox(height: 5),
-          ],
-          if (callback != null) ...[
-            if (extraWidget == null) const SizedBox(height: 20),
-            FilledButton.tonal(
-              onPressed: callback,
-              style: ButtonStyle(
-                backgroundColor: WidgetStateProperty.resolveWith((states) {
-                  return Theme.of(context).colorScheme.primary.withAlpha(20);
-                }),
-              ),
-              child: Text(
-                btnText ?? '点击重试',
-                style: TextStyle(color: Theme.of(context).colorScheme.primary),
-              ),
-            ),
-          ],
-          SizedBox(height: 40 + MediaQuery.paddingOf(context).bottom),
-        ],
-      );
-}

lib/common/widgets/image/image_save.dart

@@ -0,0 +1,140 @@
+import 'package:PiliPlus/common/constants.dart';
+import 'package:PiliPlus/common/widgets/button/icon_button.dart';
+import 'package:PiliPlus/common/widgets/image/network_img_layer.dart';
+import 'package:PiliPlus/http/user.dart';
+import 'package:PiliPlus/utils/image_util.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
+import 'package:get/get.dart';
+
+void imageSaveDialog({
+  required String? title,
+  required String? cover,
+  dynamic aid,
+  String? bvid,
+}) {
+  final double imgWidth = Get.mediaQuery.size.shortestSide - 8 * 2;
+  SmartDialog.show(
+    animationType: SmartAnimationType.centerScale_otherSlide,
+    builder: (context) {
+      final theme = Theme.of(context);
+      late final iconColor = theme.colorScheme.onSurfaceVariant;
+
+      Widget iconBtn({
+        String? tooltip,
+        required IconData icon,
+        required VoidCallback? onPressed,
+      }) {
+        return iconButton(
+          context: context,
+          onPressed: onPressed,
+          iconSize: 20,
+          icon: icon,
+          bgColor: Colors.transparent,
+          iconColor: iconColor,
+        );
+      }
+
+      return Container(
+        width: imgWidth,
+        margin: const EdgeInsets.symmetric(horizontal: StyleString.safeSpace),
+        decoration: BoxDecoration(
+          color: theme.colorScheme.surface,
+          borderRadius: StyleString.mdRadius,
+        ),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Stack(
+              clipBehavior: Clip.none,
+              children: [
+                GestureDetector(
+                  onTap: SmartDialog.dismiss,
+                  child: NetworkImgLayer(
+                    width: imgWidth,
+                    height: imgWidth / StyleString.aspectRatio,
+                    src: cover,
+                    quality: 100,
+                  ),
+                ),
+                Positioned(
+                  right: 8,
+                  top: 8,
+                  child: Container(
+                    width: 30,
+                    height: 30,
+                    decoration: BoxDecoration(
+                      color: Colors.black.withValues(alpha: 0.3),
+                      shape: BoxShape.circle,
+                    ),
+                    child: const IconButton(
+                      style: ButtonStyle(
+                        padding: WidgetStatePropertyAll(EdgeInsets.zero),
+                      ),
+                      onPressed: SmartDialog.dismiss,
+                      icon: Icon(
+                        Icons.close,
+                        size: 18,
+                        color: Colors.white,
+                      ),
+                    ),
+                  ),
+                ),
+              ],
+            ),
+            Padding(
+              padding: const EdgeInsets.fromLTRB(12, 10, 8, 10),
+              child: Row(
+                children: [
+                  if (title != null)
+                    Expanded(
+                      child: SelectableText(
+                        title,
+                        style: theme.textTheme.titleSmall,
+                      ),
+                    )
+                  else
+                    const Spacer(),
+                  if (aid != null || bvid != null)
+                    iconBtn(
+                      tooltip: '稍后再看',
+                      onPressed: () => {
+                        SmartDialog.dismiss(),
+                        UserHttp.toViewLater(aid: aid, bvid: bvid).then(
+                          (res) => SmartDialog.showToast(res['msg']),
+                        ),
+                      },
+                      icon: Icons.watch_later_outlined,
+                    ),
+                  if (cover?.isNotEmpty == true) ...[
+                    iconBtn(
+                      tooltip: '分享',
+                      onPressed: () {
+                        SmartDialog.dismiss();
+                        ImageUtil.onShareImg(cover!);
+                      },
+                      icon: Icons.share,
+                    ),
+                    iconBtn(
+                      tooltip: '保存封面图',
+                      onPressed: () async {
+                        bool saveStatus = await ImageUtil.downloadImg(
+                          context,
+                          [cover!],
+                        );
+                        if (saveStatus) {
+                          SmartDialog.dismiss();
+                        }
+                      },
+                      icon: Icons.download,
+                    ),
+                  ],
+                ],
+              ),
+            ),
+          ],
+        ),
+      );
+    },
+  );
+}

lib/common/widgets/image/image_view.dart

@@ -0,0 +1,200 @@
+import 'dart:math';
+
+import 'package:PiliPlus/common/constants.dart';
+import 'package:PiliPlus/common/widgets/badge.dart';
+import 'package:PiliPlus/common/widgets/image/network_img_layer.dart';
+import 'package:PiliPlus/common/widgets/image/nine_grid_view.dart';
+import 'package:PiliPlus/models/common/badge_type.dart';
+import 'package:PiliPlus/models/common/image_preview_type.dart';
+import 'package:PiliPlus/utils/extension.dart';
+import 'package:PiliPlus/utils/page_utils.dart';
+import 'package:PiliPlus/utils/storage_pref.dart';
+import 'package:flutter/material.dart';
+
+class ImageModel {
+  ImageModel({
+    required num? width,
+    required num? height,
+    required this.url,
+    this.liveUrl,
+  }) {
+    this.width = width == null || width == 0 ? 1 : width;
+    this.height = height == null || height == 0 ? 1 : height;
+  }
+
+  late num width;
+  late num height;
+  String url;
+  String? liveUrl;
+  bool? _isLongPic;
+  bool? _isLivePhoto;
+
+  bool get isLongPic => _isLongPic ??= (height / width) > _maxRatio;
+  bool get isLivePhoto =>
+      _isLivePhoto ??= enableLivePhoto && liveUrl?.isNotEmpty == true;
+
+  static bool enableLivePhoto = Pref.enableLivePhoto;
+}
+
+const double _maxRatio = 22 / 9;
+
+Widget imageView(
+  double maxWidth,
+  List<ImageModel> picArr, {
+  VoidCallback? onViewImage,
+  ValueChanged<int>? onDismissed,
+  Function(List<String>, int)? callback,
+}) {
+  double imageWidth = (maxWidth - 10) / 3;
+  double imageHeight = imageWidth;
+  if (picArr.length == 1) {
+    num width = picArr[0].width;
+    num height = picArr[0].height;
+    double ratioWH = width / height;
+    double ratioHW = height / width;
+    imageWidth = ratioWH > 1.5
+        ? maxWidth
+        : (ratioWH >= 1 || (height > width && ratioHW < 1.5))
+        ? 2 * imageWidth
+        : 1.5 * imageWidth;
+    if (width != 1) {
+      imageWidth = min(imageWidth, width.toDouble());
+    }
+    imageHeight = imageWidth * min(ratioHW, _maxRatio);
+  } else if (picArr.length == 2) {
+    imageWidth = imageHeight = 2 * imageWidth;
+  }
+  late final int row = picArr.length == 4 ? 2 : 3;
+  BorderRadius borderRadius(index) {
+    if (picArr.length == 1) {
+      return StyleString.mdRadius;
+    }
+    return BorderRadius.only(
+      topLeft:
+          index - row >= 0 ||
+              ((index - 1) >= 0 && (index - 1) % row < index % row)
+          ? Radius.zero
+          : StyleString.imgRadius,
+      topRight:
+          index - row >= 0 ||
+              ((index + 1) < picArr.length && (index + 1) % row > index % row)
+          ? Radius.zero
+          : StyleString.imgRadius,
+      bottomLeft:
+          index + row < picArr.length ||
+              ((index - 1) >= 0 && (index - 1) % row < index % row)
+          ? Radius.zero
+          : StyleString.imgRadius,
+      bottomRight:
+          index + row < picArr.length ||
+              ((index + 1) < picArr.length && (index + 1) % row > index % row)
+          ? Radius.zero
+          : StyleString.imgRadius,
+    );
+  }
+
+  int parseSize(size) {
+    return switch (size) {
+      int() => size,
+      double() => size.round(),
+      String() => int.tryParse(size) ?? 1,
+      _ => 1,
+    };
+  }
+
+  void onTap(int index) {
+    if (callback != null) {
+      callback(picArr.map((item) => item.url).toList(), index);
+    } else {
+      onViewImage?.call();
+      PageUtils.imageView(
+        initialPage: index,
+        imgList: picArr.map(
+          (item) {
+            bool isLive = item.isLivePhoto;
+            return SourceModel(
+              sourceType: isLive
+                  ? SourceType.livePhoto
+                  : SourceType.networkImage,
+              url: item.url,
+              liveUrl: isLive ? item.liveUrl : null,
+              width: isLive ? parseSize(item.width) : null,
+              height: isLive ? parseSize(item.height) : null,
+            );
+          },
+        ).toList(),
+        onDismissed: onDismissed,
+      );
+    }
+  }
+
+  return NineGridView(
+    type: NineGridType.weiBo,
+    margin: const EdgeInsets.only(top: 6),
+    bigImageWidth: imageWidth,
+    bigImageHeight: imageHeight,
+    space: 5,
+    height: picArr.length == 1 ? imageHeight : null,
+    width: picArr.length == 1 ? imageWidth : maxWidth,
+    itemCount: picArr.length,
+    itemBuilder: (context, index) {
+      final item = picArr[index];
+      return Hero(
+        tag: item.url,
+        child: GestureDetector(
+          onTap: () => onTap(index),
+          child: Stack(
+            clipBehavior: Clip.none,
+            alignment: Alignment.center,
+            children: [
+              ClipRRect(
+                borderRadius: borderRadius(index),
+                child: NetworkImgLayer(
+                  radius: 0,
+                  src: item.url,
+                  width: imageWidth,
+                  height: imageHeight,
+                  isLongPic: item.isLongPic,
+                  forceUseCacheWidth: item.width <= item.height,
+                  getPlaceHolder: () {
+                    return Container(
+                      width: imageWidth,
+                      height: imageHeight,
+                      decoration: BoxDecoration(
+                        color: Theme.of(
+                          context,
+                        ).colorScheme.onInverseSurface.withValues(alpha: 0.4),
+                        borderRadius: borderRadius(index),
+                      ),
+                      child: Center(
+                        child: Image.asset(
+                          'assets/images/loading.png',
+                          width: imageWidth,
+                          height: imageHeight,
+                          cacheWidth: imageWidth.cacheSize(context),
+                        ),
+                      ),
+                    );
+                  },
+                ),
+              ),
+              if (item.isLivePhoto)
+                const PBadge(
+                  text: 'Live',
+                  right: 8,
+                  bottom: 8,
+                  type: PBadgeType.gray,
+                )
+              else if (item.isLongPic)
+                const PBadge(
+                  text: '长图',
+                  right: 8,
+                  bottom: 8,
+                ),
+            ],
+          ),
+        ),
+      );
+    },
+  );
+}

lib/common/widgets/image/network_img_layer.dart

@@ -0,0 +1,126 @@
+import 'package:PiliPlus/common/constants.dart';
+import 'package:PiliPlus/models/common/image_type.dart';
+import 'package:PiliPlus/utils/extension.dart';
+import 'package:PiliPlus/utils/image_util.dart';
+import 'package:PiliPlus/utils/storage_pref.dart';
+import 'package:cached_network_image/cached_network_image.dart';
+import 'package:flutter/material.dart';
+
+class NetworkImgLayer extends StatelessWidget {
+  const NetworkImgLayer({
+    super.key,
+    required this.src,
+    required this.width,
+    this.height,
+    this.type = ImageType.def,
+    this.fadeOutDuration,
+    this.fadeInDuration,
+    // 图片质量 默认1%
+    this.quality,
+    this.semanticsLabel,
+    this.radius,
+    this.imageBuilder,
+    this.isLongPic = false,
+    this.forceUseCacheWidth = false,
+    this.getPlaceHolder,
+    this.boxFit,
+  });
+
+  final String? src;
+  final double width;
+  final double? height;
+  final ImageType type;
+  final Duration? fadeOutDuration;
+  final Duration? fadeInDuration;
+  final int? quality;
+  final String? semanticsLabel;
+  final double? radius;
+  final ImageWidgetBuilder? imageBuilder;
+  final bool isLongPic;
+  final bool forceUseCacheWidth;
+  final Widget Function()? getPlaceHolder;
+  final BoxFit? boxFit;
+
+  static Color? reduceLuxColor = Pref.reduceLuxColor;
+  static bool reduce = false;
+
+  @override
+  Widget build(BuildContext context) {
+    final noRadius = type == ImageType.emote || radius == 0;
+
+    if (src?.isNotEmpty == true) {
+      Widget child = _buildImage(context, noRadius);
+      if (noRadius) {
+        return child;
+      }
+      if (type == ImageType.avatar) {
+        return ClipOval(child: child);
+      }
+      return ClipRRect(
+        borderRadius: radius != null
+            ? BorderRadius.circular(radius!)
+            : StyleString.mdRadius,
+        child: child,
+      );
+    }
+
+    return getPlaceHolder?.call() ?? _placeholder(context, noRadius);
+  }
+
+  Widget _buildImage(BuildContext context, bool noRadius) {
+    int? memCacheWidth, memCacheHeight;
+    if (height == null || forceUseCacheWidth || width <= height!) {
+      memCacheWidth = width.cacheSize(context);
+    } else {
+      memCacheHeight = height.cacheSize(context);
+    }
+    return CachedNetworkImage(
+      imageUrl: ImageUtil.thumbnailUrl(src, quality),
+      width: width,
+      height: height,
+      memCacheWidth: memCacheWidth,
+      memCacheHeight: memCacheHeight,
+      fit: boxFit ?? BoxFit.cover,
+      alignment: isLongPic ? Alignment.topCenter : Alignment.center,
+      fadeOutDuration: fadeOutDuration ?? const Duration(milliseconds: 120),
+      fadeInDuration: fadeInDuration ?? const Duration(milliseconds: 120),
+      filterQuality: FilterQuality.low,
+      placeholder: (BuildContext context, String url) =>
+          getPlaceHolder?.call() ?? _placeholder(context, noRadius),
+      imageBuilder: imageBuilder,
+      errorWidget: (context, url, error) => _placeholder(context, noRadius),
+      colorBlendMode: reduce ? BlendMode.modulate : null,
+      color: reduce ? reduceLuxColor : null,
+    );
+  }
+
+  Widget _placeholder(BuildContext context, bool noRadius) {
+    final isAvatar = type == ImageType.avatar;
+    return Container(
+      width: width,
+      height: height,
+      clipBehavior: noRadius ? Clip.none : Clip.antiAlias,
+      decoration: BoxDecoration(
+        shape: isAvatar ? BoxShape.circle : BoxShape.rectangle,
+        color: Theme.of(
+          context,
+        ).colorScheme.onInverseSurface.withValues(alpha: 0.4),
+        borderRadius: noRadius || isAvatar
+            ? null
+            : radius != null
+            ? BorderRadius.circular(radius!)
+            : StyleString.mdRadius,
+      ),
+      child: Center(
+        child: Image.asset(
+          isAvatar ? 'assets/images/noface.jpeg' : 'assets/images/loading.png',
+          width: width,
+          height: height,
+          cacheWidth: width.cacheSize(context),
+          colorBlendMode: reduce ? BlendMode.modulate : null,
+          color: reduce ? reduceLuxColor : null,
+        ),
+      ),
+    );
+  }
+}

lib/common/widgets/image/nine_grid_view.dart

@@ -1,9 +1,9 @@
-import 'package:flutter/material.dart';
-
 import 'dart:async';
 import 'dart:collection';
 import 'dart:math' as math;
 
+import 'package:flutter/material.dart';
+
 /**
  * @Author: Sky24n
  * @GitHub: https://github.com/Sky24n
@@ -133,8 +133,9 @@ class _NineGridViewState extends State<NineGridView> {
     if (widget.itemCount == 0) {
       return Rect.fromLTRB(0, 0, padding.horizontal, padding.vertical);
     }
-    double width = widget.width ??
-        (MediaQuery.of(context).size.width - widget.margin.horizontal);
+    double width =
+        widget.width ??
+        (MediaQuery.sizeOf(context).width - widget.margin.horizontal);
     width = width - padding.horizontal;
     double space = widget.space;
     double itemW;
@@ -158,20 +159,25 @@ class _NineGridViewState extends State<NineGridView> {
   /// build nine grid view.
   Widget _buildChild(BuildContext context, double itemW) {
     double space = widget.space;
-    int column =
-        (widget.itemCount == 4 && widget.type != NineGridType.normal) ? 2 : 3;
+    int column = (widget.itemCount == 4 && widget.type != NineGridType.normal)
+        ? 2
+        : 3;
     List<Widget> list = [];
     for (int i = 0; i < widget.itemCount; i++) {
-      list.add(Positioned(
+      list.add(
+        Positioned(
           top: (space + itemW) * (i ~/ column),
           left: (space + itemW) * (i % column),
           child: SizedBox(
             width: itemW,
             height: itemW,
             child: widget.itemBuilder(context, i),
-          )));
+          ),
+        ),
+      );
     }
     return Stack(
+      clipBehavior: Clip.none,
       children: list,
     );
   }
@@ -190,11 +196,14 @@ class _NineGridViewState extends State<NineGridView> {
       if (!_isZero(bigImgWidth) && !_isZero(bigImgHeight)) {
         return _getOneChild(context, bigImgWidth!, bigImgHeight!);
       } else {
-        _ImageUtil().getImageSize(widget.bigImage)?.then((rect) {
-          ngvBigImageSizeMap[bigImageUrl] = rect;
-          if (!mounted) return;
-          setState(() {});
-        }).catchError((e) {});
+        _ImageUtil()
+            .getImageSize(widget.bigImage)
+            ?.then((rect) {
+              ngvBigImageSizeMap[bigImageUrl] = rect;
+              if (!mounted) return;
+              setState(() {});
+            })
+            .catchError((e) {});
       }
     }
     return null;
@@ -237,7 +246,8 @@ class _NineGridViewState extends State<NineGridView> {
     for (int i = 0; i < widget.itemCount; i++) {
       double left;
       if (first > 0 && i < first) {
-        left = (width - itemW * first - space * (first - 1)) / 2 +
+        left =
+            (width - itemW * first - space * (first - 1)) / 2 +
             (itemW + space) * i;
       } else {
         left = (space + itemW) * ((i - first) % column);
@@ -247,19 +257,24 @@ class _NineGridViewState extends State<NineGridView> {
           ? 0
           : (first > 0 ? (i + column - first) : i) ~/ column;
 
-      double top = (width - itemW * row - space * (row - 1)) / 2 +
+      double top =
+          (width - itemW * row - space * (row - 1)) / 2 +
           (space + itemW) * itemIndex;
 
-      list.add(Positioned(
+      list.add(
+        Positioned(
           top: top,
           left: left,
           child: SizedBox(
             width: itemW,
             height: itemW,
             child: widget.itemBuilder(context, i),
-          )));
+          ),
+        ),
+      );
     }
     return Stack(
+      clipBehavior: Clip.none,
       children: list,
     );
   }
@@ -271,21 +286,26 @@ class _NineGridViewState extends State<NineGridView> {
     double itemW = (width - widget.space) / 2;
     List<Widget> children = [];
     for (int i = 0; i < itemCount; i++) {
-      children.add(Positioned(
+      children.add(
+        Positioned(
           top: (widget.space + itemW) * (i ~/ 2),
-          left: (widget.space + itemW) *
+          left:
+              (widget.space + itemW) *
               (((itemCount == 3 && i == 2) ? i + 1 : i) % 2),
           child: SizedBox(
             width: itemCount == 1 ? width : itemW,
             height:
                 (itemCount == 1 || itemCount == 2 || (itemCount == 3 && i == 0))
-                    ? width
-                    : itemW,
+                ? width
+                : itemW,
             child: widget.itemBuilder(context, i),
-          )));
+          ),
+        ),
+      );
     }
     return ClipOval(
       child: Stack(
+        clipBehavior: Clip.none,
         children: children,
       ),
     );
@@ -297,11 +317,12 @@ class _NineGridViewState extends State<NineGridView> {
     int itemCount = math.min(5, widget.itemCount);
     if (itemCount == 1) {
       return ClipOval(
-          child: SizedBox(
-        width: width,
-        height: width,
-        child: widget.itemBuilder(context, 0),
-      ));
+        child: SizedBox(
+          width: width,
+          height: width,
+          child: widget.itemBuilder(context, 0),
+        ),
+      );
     }
 
     List<Widget> children = [];
@@ -320,7 +341,8 @@ class _NineGridViewState extends State<NineGridView> {
         startDegree = 210;
         r = width / (2 + 4 * math.sin(math.pi * (3 - 2) / (2 * 3)));
         r1 = r / math.cos(math.pi * (3 - 2) / (2 * 3));
-        double R = r *
+        double R =
+            r *
             (1 + math.sin(math.pi / itemCount)) /
             math.sin(math.pi / itemCount);
         double dy = 0.5 * (width - R - r * (1 + 1 / math.tan(math.pi / 3)));
@@ -335,7 +357,8 @@ class _NineGridViewState extends State<NineGridView> {
         startDegree = 126;
         r = width / (2 + 4 * math.sin(math.pi * (5 - 2) / (2 * 5)));
         r1 = r / math.cos(math.pi * (5 - 2) / (2 * 5));
-        double R = r *
+        double R =
+            r *
             (1 + math.sin(math.pi / itemCount)) /
             math.sin(math.pi / itemCount);
         double dy = 0.5 * (width - R - r * (1 + 1 / math.tan(math.pi / 5)));
@@ -372,7 +395,10 @@ class _NineGridViewState extends State<NineGridView> {
       children.add(child);
     }
 
-    return Stack(children: children);
+    return Stack(
+      clipBehavior: Clip.none,
+      children: children,
+    );
   }
 
   /// double is zero.
@@ -382,12 +408,13 @@ class _NineGridViewState extends State<NineGridView> {
 
   /// get big image size.
   Rect _getBigImgSize(double originalWidth, double originalHeight) {
-    double width = widget.width ??
-        (MediaQuery.of(context).size.width - widget.margin.horizontal);
+    double width =
+        widget.width ??
+        (MediaQuery.sizeOf(context).width - widget.margin.horizontal);
     width = width - widget.padding.horizontal;
     double itemW = (width - widget.space * 2) / 3;
 
-    //double devicePixelRatio = MediaQuery.of(context)?.devicePixelRatio ?? 3;
+    // double devicePixelRatio = MediaQuery.devicePixelRatioOf(context);
     double devicePixelRatio = 1.0;
     double tempWidth = originalWidth / devicePixelRatio;
     double tempHeight = originalHeight / devicePixelRatio;
@@ -469,8 +496,14 @@ class _ImageUtil {
       (ImageInfo info, bool synchronousCall) {
         imageStream.removeListener(listener);
         if (!completer.isCompleted) {
-          completer.complete(Rect.fromLTWH(
-              0, 0, info.image.width.toDouble(), info.image.height.toDouble()));
+          completer.complete(
+            Rect.fromLTWH(
+              0,
+              0,
+              info.image.width.toDouble(),
+              info.image.height.toDouble(),
+            ),
+          );
         }
       },
       onError: (dynamic exception, StackTrace? stackTrace) {
@@ -480,7 +513,7 @@ class _ImageUtil {
         }
       },
     );
-    imageStream = image.image.resolve(const ImageConfiguration());
+    imageStream = image.image.resolve(ImageConfiguration.empty);
     imageStream.addListener(listener);
     return completer.future;
   }
@@ -529,8 +562,10 @@ class QQClipper extends CustomClipper<Path> {
         points.add(Offset(x1, y1));
       }
 
-      double spaceB = math.atan(
-              r * math.sin(d2r(spaceA)) / (2 * r - r * math.cos(d2r(spaceA)))) /
+      double spaceB =
+          math.atan(
+            r * math.sin(d2r(spaceA)) / (2 * r - r * math.cos(d2r(spaceA))),
+          ) /
           math.pi *
           180;
       double r1 = (2 * r - r * math.cos(d2r(spaceA))) / math.cos(d2r(spaceB));

lib/common/widgets/image_save.dart

@@ -1,96 +0,0 @@
-import 'dart:math';
-
-import 'package:PiliPlus/common/constants.dart';
-import 'package:PiliPlus/common/widgets/network_img_layer.dart';
-import 'package:PiliPlus/utils/download.dart';
-import 'package:flutter/material.dart';
-import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
-import 'package:get/get.dart';
-
-void imageSaveDialog({
-  required BuildContext context,
-  required String? title,
-  required String? cover,
-}) {
-  final double imgWidth = min(Get.width, Get.height) - 8 * 2;
-  SmartDialog.show(
-    animationType: SmartAnimationType.centerScale_otherSlide,
-    builder: (context) => Container(
-      width: imgWidth,
-      margin: const EdgeInsets.symmetric(horizontal: StyleString.safeSpace),
-      decoration: BoxDecoration(
-        color: Theme.of(context).colorScheme.surface,
-        borderRadius: BorderRadius.circular(10.0),
-      ),
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
-        children: [
-          Stack(
-            children: [
-              GestureDetector(
-                onTap: SmartDialog.dismiss,
-                child: NetworkImgLayer(
-                  width: imgWidth,
-                  height: imgWidth / StyleString.aspectRatio,
-                  src: cover,
-                  quality: 100,
-                ),
-              ),
-              Positioned(
-                right: 8,
-                top: 8,
-                child: Container(
-                  width: 30,
-                  height: 30,
-                  decoration: BoxDecoration(
-                    color: Colors.black.withOpacity(0.3),
-                    shape: BoxShape.circle,
-                  ),
-                  child: IconButton(
-                    style: ButtonStyle(
-                      padding: WidgetStateProperty.all(EdgeInsets.zero),
-                    ),
-                    onPressed: SmartDialog.dismiss,
-                    icon: const Icon(
-                      Icons.close,
-                      size: 18,
-                      color: Colors.white,
-                    ),
-                  ),
-                ),
-              ),
-            ],
-          ),
-          Padding(
-            padding: const EdgeInsets.fromLTRB(12, 10, 8, 10),
-            child: Row(
-              children: [
-                Expanded(
-                  child: SelectableText(
-                    title ?? '',
-                    style: Theme.of(context).textTheme.titleSmall,
-                  ),
-                ),
-                const SizedBox(width: 4),
-                IconButton(
-                  tooltip: '保存封面图',
-                  onPressed: () async {
-                    bool saveStatus = await DownloadUtils.downloadImg(
-                      context,
-                      [cover ?? ''],
-                    );
-                    // 保存成功，自动关闭弹窗
-                    if (saveStatus) {
-                      SmartDialog.dismiss();
-                    }
-                  },
-                  icon: const Icon(Icons.download, size: 20),
-                )
-              ],
-            ),
-          ),
-        ],
-      ),
-    ),
-  );
-}

lib/common/widgets/imageview.dart

@@ -1,194 +0,0 @@
-import 'dart:math';
-
-import 'package:PiliPlus/common/constants.dart';
-import 'package:PiliPlus/common/widgets/badge.dart';
-import 'package:PiliPlus/common/widgets/interactiveviewer_gallery/interactiveviewer_gallery.dart'
-    show SourceModel, SourceType;
-import 'package:PiliPlus/common/widgets/network_img_layer.dart';
-import 'package:PiliPlus/common/widgets/nine_grid_view.dart';
-import 'package:PiliPlus/utils/extension.dart';
-import 'package:PiliPlus/utils/storage.dart';
-import 'package:flutter/material.dart';
-
-class ImageModel {
-  ImageModel({
-    required this.width,
-    required this.height,
-    required this.url,
-    this.liveUrl,
-  });
-
-  dynamic width;
-  dynamic height;
-  String url;
-  String? liveUrl;
-  bool? _isLongPic;
-  bool? _isLivePhoto;
-
-  dynamic get safeWidth => width ?? 1;
-  dynamic get safeHeight => height ?? 1;
-  bool get isLongPic => _isLongPic ??= (safeHeight / safeWidth) > (22 / 9);
-  bool get isLivePhoto => _isLivePhoto ??= liveUrl?.isNotEmpty == true;
-}
-
-Widget imageview(
-  double maxWidth,
-  List<ImageModel> picArr, {
-  VoidCallback? onViewImage,
-  ValueChanged<int>? onDismissed,
-  Function(List<String>, int)? callback,
-}) {
-  double imageWidth = (maxWidth - 2 * 5) / 3;
-  double imageHeight = imageWidth;
-  if (picArr.length == 1) {
-    dynamic width = picArr[0].safeWidth;
-    dynamic height = picArr[0].safeHeight;
-    double ratioWH = width / height;
-    double ratioHW = height / width;
-    double maxRatio = 22 / 9;
-    imageWidth = ratioWH > 1.5
-        ? maxWidth
-        : (ratioWH >= 1 || (height > width && ratioHW < 1.5))
-            ? 2 * imageWidth
-            : 1.5 * imageWidth;
-    imageHeight = imageWidth * min(ratioHW, maxRatio);
-  } else if (picArr.length == 2) {
-    imageWidth = imageHeight = 2 * imageWidth;
-  }
-  BorderRadius borderRadius(index) {
-    if (picArr.length == 1) {
-      return StyleString.mdRadius;
-    }
-    final int row = picArr.length == 4 ? 2 : 3;
-    return BorderRadius.only(
-      topLeft: Radius.circular(
-        (index - row >= 0 ||
-                ((index - 1) >= 0 && (index - 1) % row < index % row))
-            ? 0
-            : 10,
-      ),
-      topRight: Radius.circular(
-        (index - row >= 0 ||
-                ((index + 1) < picArr.length &&
-                    (index + 1) % row > index % row))
-            ? 0
-            : 10,
-      ),
-      bottomLeft: Radius.circular(
-        (index + row < picArr.length ||
-                ((index - 1) >= 0 && (index - 1) % row < index % row))
-            ? 0
-            : 10,
-      ),
-      bottomRight: Radius.circular(
-        (index + row < picArr.length ||
-                ((index + 1) < picArr.length &&
-                    (index + 1) % row > index % row))
-            ? 0
-            : 10,
-      ),
-    );
-  }
-
-  late final enableLivePhoto = GStorage.enableLivePhoto;
-
-  int parseSize(size) {
-    return switch (size) {
-      int() => size,
-      double() => size.round(),
-      String() => int.tryParse(size) ?? 1,
-      _ => 1,
-    };
-  }
-
-  return NineGridView(
-    type: NineGridType.weiBo,
-    margin: const EdgeInsets.only(top: 6),
-    bigImageWidth: imageWidth,
-    bigImageHeight: imageHeight,
-    space: 5,
-    height: picArr.length == 1 ? imageHeight : null,
-    width: picArr.length == 1 ? imageWidth : maxWidth,
-    itemCount: picArr.length,
-    itemBuilder: (context, index) => Hero(
-      tag: picArr[index].url,
-      child: GestureDetector(
-        onTap: () {
-          if (callback != null) {
-            callback(picArr.map((item) => item.url).toList(), index);
-          } else {
-            onViewImage?.call();
-            context.imageView(
-              initialPage: index,
-              imgList: picArr.map(
-                (item) {
-                  bool isLive = item.isLivePhoto && enableLivePhoto;
-                  return SourceModel(
-                    sourceType:
-                        isLive ? SourceType.livePhoto : SourceType.networkImage,
-                    url: item.url,
-                    liveUrl: isLive ? item.liveUrl : null,
-                    width: isLive ? parseSize(item.width) : null,
-                    height: isLive ? parseSize(item.height) : null,
-                  );
-                },
-              ).toList(),
-              onDismissed: onDismissed,
-            );
-          }
-        },
-        child: Stack(
-          alignment: Alignment.center,
-          children: [
-            ClipRRect(
-              borderRadius: borderRadius(index),
-              child: NetworkImgLayer(
-                radius: 0,
-                src: picArr[index].url,
-                width: imageWidth,
-                height: imageHeight,
-                isLongPic: () => picArr[index].isLongPic,
-                callback: () =>
-                    picArr[index].safeWidth <= picArr[index].safeHeight,
-                getPlaceHolder: () {
-                  return Container(
-                    width: imageWidth,
-                    height: imageHeight,
-                    decoration: BoxDecoration(
-                      color: Theme.of(context)
-                          .colorScheme
-                          .onInverseSurface
-                          .withOpacity(0.4),
-                      borderRadius: borderRadius(index),
-                    ),
-                    child: Center(
-                      child: Image.asset(
-                        'assets/images/loading.png',
-                        width: imageWidth,
-                        height: imageHeight,
-                        cacheWidth: imageWidth.cacheSize(context),
-                      ),
-                    ),
-                  );
-                },
-              ),
-            ),
-            if (picArr[index].isLivePhoto)
-              const PBadge(
-                text: 'Live',
-                right: 8,
-                bottom: 8,
-                type: 'gray',
-              )
-            else if (picArr[index].isLongPic)
-              const PBadge(
-                text: '长图',
-                right: 8,
-                bottom: 8,
-              ),
-          ],
-        ),
-      ),
-    ),
-  );
-}

lib/common/widgets/interactiveviewer_gallery/interactive_viewer.dart

@@ -22,8 +22,8 @@ import 'package:vector_math/vector_math_64.dart' show Matrix4, Quad, Vector3;
 ///
 ///   * [InteractiveViewer.builder], whose builder is of this type.
 ///   * [WidgetBuilder], which is similar, but takes no viewport.
-typedef InteractiveViewerWidgetBuilder = Widget Function(
-    BuildContext context, Quad viewport);
+typedef InteractiveViewerWidgetBuilder =
+    Widget Function(BuildContext context, Quad viewport);
 
 /// A widget that enables pan and zoom interactions with its child.
 ///
@@ -82,23 +82,23 @@ class InteractiveViewer extends StatefulWidget {
     this.onReset,
     this.isAnimating,
     required Widget this.child,
-  })  : assert(minScale > 0),
-        assert(interactionEndFrictionCoefficient > 0),
-        assert(minScale.isFinite),
-        assert(maxScale > 0),
-        assert(!maxScale.isNaN),
-        assert(maxScale >= minScale),
-        // boundaryMargin must be either fully infinite or fully finite, but not
-        // a mix of both.
-        assert(
-          (boundaryMargin.horizontal.isInfinite &&
-                  boundaryMargin.vertical.isInfinite) ||
-              (boundaryMargin.top.isFinite &&
-                  boundaryMargin.right.isFinite &&
-                  boundaryMargin.bottom.isFinite &&
-                  boundaryMargin.left.isFinite),
-        ),
-        builder = null;
+  }) : assert(minScale > 0),
+       assert(interactionEndFrictionCoefficient > 0),
+       assert(minScale.isFinite),
+       assert(maxScale > 0),
+       assert(!maxScale.isNaN),
+       assert(maxScale >= minScale),
+       // boundaryMargin must be either fully infinite or fully finite, but not
+       // a mix of both.
+       assert(
+         (boundaryMargin.horizontal.isInfinite &&
+                 boundaryMargin.vertical.isInfinite) ||
+             (boundaryMargin.top.isFinite &&
+                 boundaryMargin.right.isFinite &&
+                 boundaryMargin.bottom.isFinite &&
+                 boundaryMargin.left.isFinite),
+       ),
+       builder = null;
 
   /// Creates an InteractiveViewer for a child that is created on demand.
   ///
@@ -132,24 +132,24 @@ class InteractiveViewer extends StatefulWidget {
     this.onReset,
     this.isAnimating,
     required InteractiveViewerWidgetBuilder this.builder,
-  })  : assert(minScale > 0),
-        assert(interactionEndFrictionCoefficient > 0),
-        assert(minScale.isFinite),
-        assert(maxScale > 0),
-        assert(!maxScale.isNaN),
-        assert(maxScale >= minScale),
-        // boundaryMargin must be either fully infinite or fully finite, but not
-        // a mix of both.
-        assert(
-          (boundaryMargin.horizontal.isInfinite &&
-                  boundaryMargin.vertical.isInfinite) ||
-              (boundaryMargin.top.isFinite &&
-                  boundaryMargin.right.isFinite &&
-                  boundaryMargin.bottom.isFinite &&
-                  boundaryMargin.left.isFinite),
-        ),
-        constrained = false,
-        child = null;
+  }) : assert(minScale > 0),
+       assert(interactionEndFrictionCoefficient > 0),
+       assert(minScale.isFinite),
+       assert(maxScale > 0),
+       assert(!maxScale.isNaN),
+       assert(maxScale >= minScale),
+       // boundaryMargin must be either fully infinite or fully finite, but not
+       // a mix of both.
+       assert(
+         (boundaryMargin.horizontal.isInfinite &&
+                 boundaryMargin.vertical.isInfinite) ||
+             (boundaryMargin.top.isFinite &&
+                 boundaryMargin.right.isFinite &&
+                 boundaryMargin.bottom.isFinite &&
+                 boundaryMargin.left.isFinite),
+       ),
+       constrained = false,
+       child = null;
 
   final Function? isAnimating;
   final VoidCallback? onReset;
@@ -402,7 +402,8 @@ class InteractiveViewer extends StatefulWidget {
   /// Returns the closest point to the given point on the given line segment.
   @visibleForTesting
   static Vector3 getNearestPointOnLine(Vector3 point, Vector3 l1, Vector3 l2) {
-    final double lengthSquared = math.pow(l2.x - l1.x, 2.0).toDouble() +
+    final double lengthSquared =
+        math.pow(l2.x - l1.x, 2.0).toDouble() +
         math.pow(l2.y - l1.y, 2.0).toDouble();
 
     // In this case, l1 == l2.
@@ -414,8 +415,11 @@ class InteractiveViewer extends StatefulWidget {
     // the point.
     final Vector3 l1P = point - l1;
     final Vector3 l1L2 = l2 - l1;
-    final double fraction =
-        clampDouble(l1P.dot(l1L2) / lengthSquared, 0.0, 1.0);
+    final double fraction = clampDouble(
+      l1P.dot(l1L2) / lengthSquared,
+      0.0,
+      1.0,
+    );
     return l1 + l1L2 * fraction;
   }
 
@@ -558,8 +562,9 @@ class _InteractiveViewerState extends State<InteractiveViewer>
     final RenderBox childRenderBox =
         _childKey.currentContext!.findRenderObject()! as RenderBox;
     final Size childSize = childRenderBox.size;
-    final Rect boundaryRect =
-        widget.boundaryMargin.inflateRect(Offset.zero & childSize);
+    final Rect boundaryRect = widget.boundaryMargin.inflateRect(
+      Offset.zero & childSize,
+    );
     assert(
       !boundaryRect.isEmpty,
       "InteractiveViewer's child must have nonzero dimensions.",
@@ -631,8 +636,10 @@ class _InteractiveViewerState extends State<InteractiveViewer>
     );
 
     // If the given translation fits completely within the boundaries, allow it.
-    final Offset offendingDistance =
-        _exceedsBy(boundariesAabbQuad, nextViewport);
+    final Offset offendingDistance = _exceedsBy(
+      boundariesAabbQuad,
+      nextViewport,
+    );
     if (offendingDistance == Offset.zero) {
       return nextMatrix;
     }
@@ -651,17 +658,23 @@ class _InteractiveViewerState extends State<InteractiveViewer>
     // complicated than this when rotated.
     // https://github.com/flutter/flutter/issues/57698
     final Matrix4 correctedMatrix = matrix.clone()
-      ..setTranslation(Vector3(
-        correctedTotalTranslation.dx,
-        correctedTotalTranslation.dy,
-        0.0,
-      ));
+      ..setTranslation(
+        Vector3(
+          correctedTotalTranslation.dx,
+          correctedTotalTranslation.dy,
+          0.0,
+        ),
+      );
 
     // Double check that the corrected translation fits.
-    final Quad correctedViewport =
-        _transformViewport(correctedMatrix, _viewport);
-    final Offset offendingCorrectedDistance =
-        _exceedsBy(boundariesAabbQuad, correctedViewport);
+    final Quad correctedViewport = _transformViewport(
+      correctedMatrix,
+      _viewport,
+    );
+    final Offset offendingCorrectedDistance = _exceedsBy(
+      boundariesAabbQuad,
+      correctedViewport,
+    );
     if (offendingCorrectedDistance == Offset.zero) {
       return correctedMatrix;
     }
@@ -680,12 +693,13 @@ class _InteractiveViewerState extends State<InteractiveViewer>
       offendingCorrectedDistance.dx == 0.0 ? correctedTotalTranslation.dx : 0.0,
       offendingCorrectedDistance.dy == 0.0 ? correctedTotalTranslation.dy : 0.0,
     );
-    return matrix.clone()
-      ..setTranslation(Vector3(
+    return matrix.clone()..setTranslation(
+      Vector3(
         unidirectionalCorrectedTotalTranslation.dx,
         unidirectionalCorrectedTotalTranslation.dy,
         0.0,
-      ));
+      ),
+    );
   }
 
   // Return a new matrix representing the given matrix after applying the given
@@ -698,8 +712,8 @@ class _InteractiveViewerState extends State<InteractiveViewer>
 
     // Don't allow a scale that results in an overall scale beyond min/max
     // scale.
-    final double currentScale =
-        _transformationController!.value.getMaxScaleOnAxis();
+    final double currentScale = _transformationController!.value
+        .getMaxScaleOnAxis();
     final double totalScale = math.max(
       currentScale * scale,
       // Ensure that the scale cannot make the child so big that it can't fit
@@ -771,14 +785,16 @@ class _InteractiveViewerState extends State<InteractiveViewer>
     widget.onInteractionStart?.call(details);
 
     if (_controller.isAnimating) {
-      _controller.stop();
-      _controller.reset();
+      _controller
+        ..stop()
+        ..reset();
       _animation?.removeListener(_onAnimate);
       _animation = null;
     }
     if (_scaleController.isAnimating) {
-      _scaleController.stop();
-      _scaleController.reset();
+      _scaleController
+        ..stop()
+        ..reset();
       _scaleAnimation?.removeListener(_onScaleAnimate);
       _scaleAnimation = null;
     }
@@ -931,10 +947,12 @@ class _InteractiveViewerState extends State<InteractiveViewer>
           _currentAxis = null;
           return;
         }
-        final Vector3 translationVector =
-            _transformationController!.value.getTranslation();
-        final Offset translation =
-            Offset(translationVector.x, translationVector.y);
+        final Vector3 translationVector = _transformationController!.value
+            .getTranslation();
+        final Offset translation = Offset(
+          translationVector.x,
+          translationVector.y,
+        );
         final FrictionSimulation frictionSimulationX = FrictionSimulation(
           widget.interactionEndFrictionCoefficient,
           translation.dx,
@@ -949,13 +967,19 @@ class _InteractiveViewerState extends State<InteractiveViewer>
           details.velocity.pixelsPerSecond.distance,
           widget.interactionEndFrictionCoefficient,
         );
-        _animation = Tween<Offset>(
-          begin: translation,
-          end: Offset(frictionSimulationX.finalX, frictionSimulationY.finalX),
-        ).animate(CurvedAnimation(
-          parent: _controller,
-          curve: Curves.decelerate,
-        ));
+        _animation =
+            Tween<Offset>(
+              begin: translation,
+              end: Offset(
+                frictionSimulationX.finalX,
+                frictionSimulationY.finalX,
+              ),
+            ).animate(
+              CurvedAnimation(
+                parent: _controller,
+                curve: Curves.decelerate,
+              ),
+            );
         _controller.duration = Duration(milliseconds: (tFinal * 1000).round());
         _animation!.addListener(_onAnimate);
         _controller.forward();
@@ -964,21 +988,31 @@ class _InteractiveViewerState extends State<InteractiveViewer>
           _currentAxis = null;
           return;
         }
-        final double scale =
-            _transformationController!.value.getMaxScaleOnAxis();
+        final double scale = _transformationController!.value
+            .getMaxScaleOnAxis();
         final FrictionSimulation frictionSimulation = FrictionSimulation(
-            widget.interactionEndFrictionCoefficient * widget.scaleFactor,
-            scale,
-            details.scaleVelocity / 10);
-        final double tFinal = _getFinalTime(details.scaleVelocity.abs(),
-            widget.interactionEndFrictionCoefficient,
-            effectivelyMotionless: 0.1);
+          widget.interactionEndFrictionCoefficient * widget.scaleFactor,
+          scale,
+          details.scaleVelocity / 10,
+        );
+        final double tFinal = _getFinalTime(
+          details.scaleVelocity.abs(),
+          widget.interactionEndFrictionCoefficient,
+          effectivelyMotionless: 0.1,
+        );
         _scaleAnimation =
-            Tween<double>(begin: scale, end: frictionSimulation.x(tFinal))
-                .animate(CurvedAnimation(
-                    parent: _scaleController, curve: Curves.decelerate));
-        _scaleController.duration =
-            Duration(milliseconds: (tFinal * 1000).round());
+            Tween<double>(
+              begin: scale,
+              end: frictionSimulation.x(tFinal),
+            ).animate(
+              CurvedAnimation(
+                parent: _scaleController,
+                curve: Curves.decelerate,
+              ),
+            );
+        _scaleController.duration = Duration(
+          milliseconds: (tFinal * 1000).round(),
+        );
         _scaleAnimation!.addListener(_onScaleAnimate);
         _scaleController.forward();
       case _GestureType.rotate || null:
@@ -1007,11 +1041,13 @@ class _InteractiveViewerState extends State<InteractiveViewer>
         );
 
         if (!_gestureIsSupported(_GestureType.pan)) {
-          widget.onInteractionUpdate?.call(ScaleUpdateDetails(
-            focalPoint: event.position - event.scrollDelta,
-            localFocalPoint: event.localPosition - event.scrollDelta,
-            focalPointDelta: -localDelta,
-          ));
+          widget.onInteractionUpdate?.call(
+            ScaleUpdateDetails(
+              focalPoint: event.position - event.scrollDelta,
+              localFocalPoint: event.localPosition - event.scrollDelta,
+              focalPointDelta: -localDelta,
+            ),
+          );
           widget.onInteractionEnd?.call(ScaleEndDetails());
           return;
         }
@@ -1025,13 +1061,17 @@ class _InteractiveViewerState extends State<InteractiveViewer>
         );
 
         _transformationController!.value = _matrixTranslate(
-            _transformationController!.value,
-            newFocalPointScene - focalPointScene);
+          _transformationController!.value,
+          newFocalPointScene - focalPointScene,
+        );
 
-        widget.onInteractionUpdate?.call(ScaleUpdateDetails(
+        widget.onInteractionUpdate?.call(
+          ScaleUpdateDetails(
             focalPoint: event.position - event.scrollDelta,
             localFocalPoint: event.localPosition - localDelta,
-            focalPointDelta: -localDelta));
+            focalPointDelta: -localDelta,
+          ),
+        );
         widget.onInteractionEnd?.call(ScaleEndDetails());
         return;
       }
@@ -1053,11 +1093,13 @@ class _InteractiveViewerState extends State<InteractiveViewer>
     );
 
     if (!_gestureIsSupported(_GestureType.scale)) {
-      widget.onInteractionUpdate?.call(ScaleUpdateDetails(
-        focalPoint: event.position,
-        localFocalPoint: event.localPosition,
-        scale: scaleChange,
-      ));
+      widget.onInteractionUpdate?.call(
+        ScaleUpdateDetails(
+          focalPoint: event.position,
+          localFocalPoint: event.localPosition,
+          scale: scaleChange,
+        ),
+      );
       widget.onInteractionEnd?.call(ScaleEndDetails());
       return;
     }
@@ -1081,11 +1123,13 @@ class _InteractiveViewerState extends State<InteractiveViewer>
       focalPointSceneScaled - focalPointScene,
     );
 
-    widget.onInteractionUpdate?.call(ScaleUpdateDetails(
-      focalPoint: event.position,
-      localFocalPoint: event.localPosition,
-      scale: scaleChange,
-    ));
+    widget.onInteractionUpdate?.call(
+      ScaleUpdateDetails(
+        focalPoint: event.position,
+        localFocalPoint: event.localPosition,
+        scale: scaleChange,
+      ),
+    );
     widget.onInteractionEnd?.call(ScaleEndDetails());
   }
 
@@ -1099,8 +1143,8 @@ class _InteractiveViewerState extends State<InteractiveViewer>
       return;
     }
     // Translate such that the resulting translation is _animation.value.
-    final Vector3 translationVector =
-        _transformationController!.value.getTranslation();
+    final Vector3 translationVector = _transformationController!.value
+        .getTranslation();
     final Offset translation = Offset(translationVector.x, translationVector.y);
     final Offset translationScene = _transformationController!.toScene(
       translation,
@@ -1174,27 +1218,33 @@ class _InteractiveViewerState extends State<InteractiveViewer>
     // transformationControllers.
     if (oldWidget.transformationController == null) {
       if (widget.transformationController != null) {
-        _transformationController!
-            .removeListener(_onTransformationControllerChange);
+        _transformationController!.removeListener(
+          _onTransformationControllerChange,
+        );
         _transformationController!.dispose();
         _transformationController = widget.transformationController;
-        _transformationController!
-            .addListener(_onTransformationControllerChange);
+        _transformationController!.addListener(
+          _onTransformationControllerChange,
+        );
       }
     } else {
       if (widget.transformationController == null) {
-        _transformationController!
-            .removeListener(_onTransformationControllerChange);
+        _transformationController!.removeListener(
+          _onTransformationControllerChange,
+        );
         _transformationController = TransformationController();
-        _transformationController!
-            .addListener(_onTransformationControllerChange);
+        _transformationController!.addListener(
+          _onTransformationControllerChange,
+        );
       } else if (widget.transformationController !=
           oldWidget.transformationController) {
-        _transformationController!
-            .removeListener(_onTransformationControllerChange);
+        _transformationController!.removeListener(
+          _onTransformationControllerChange,
+        );
         _transformationController = widget.transformationController;
-        _transformationController!
-            .addListener(_onTransformationControllerChange);
+        _transformationController!.addListener(
+          _onTransformationControllerChange,
+        );
       }
     }
   }
@@ -1203,8 +1253,9 @@ class _InteractiveViewerState extends State<InteractiveViewer>
   void dispose() {
     _controller.dispose();
     _scaleController.dispose();
-    _transformationController!
-        .removeListener(_onTransformationControllerChange);
+    _transformationController!.removeListener(
+      _onTransformationControllerChange,
+    );
     if (widget.transformationController == null) {
       _transformationController!.dispose();
     }
@@ -1327,7 +1378,7 @@ class TransformationController extends ValueNotifier<Matrix4> {
   /// The [value] defaults to the identity matrix, which corresponds to no
   /// transformation.
   TransformationController([Matrix4? value])
-      : super(value ?? Matrix4.identity());
+    : super(value ?? Matrix4.identity());
 
   /// Return the scene point at the given viewport point.
   ///
@@ -1363,11 +1414,13 @@ class TransformationController extends ValueNotifier<Matrix4> {
     // On viewportPoint, perform the inverse transformation of the scene to get
     // where the point would be in the scene before the transformation.
     final Matrix4 inverseMatrix = Matrix4.inverted(value);
-    final Vector3 untransformed = inverseMatrix.transform3(Vector3(
-      viewportPoint.dx,
-      viewportPoint.dy,
-      0,
-    ));
+    final Vector3 untransformed = inverseMatrix.transform3(
+      Vector3(
+        viewportPoint.dx,
+        viewportPoint.dy,
+        0,
+      ),
+    );
     return Offset(untransformed.x, untransformed.y);
   }
 }
@@ -1382,8 +1435,11 @@ enum _GestureType {
 
 // Given a velocity and drag, calculate the time at which motion will come to
 // a stop, within the margin of effectivelyMotionless.
-double _getFinalTime(double velocity, double drag,
-    {double effectivelyMotionless = 10}) {
+double _getFinalTime(
+  double velocity,
+  double drag, {
+  double effectivelyMotionless = 10,
+}) {
   return math.log(effectivelyMotionless / velocity) / math.log(drag / 100);
 }
 
@@ -1400,26 +1456,34 @@ Offset _getMatrixTranslation(Matrix4 matrix) {
 Quad _transformViewport(Matrix4 matrix, Rect viewport) {
   final Matrix4 inverseMatrix = matrix.clone()..invert();
   return Quad.points(
-    inverseMatrix.transform3(Vector3(
-      viewport.topLeft.dx,
-      viewport.topLeft.dy,
-      0.0,
-    )),
-    inverseMatrix.transform3(Vector3(
-      viewport.topRight.dx,
-      viewport.topRight.dy,
-      0.0,
-    )),
-    inverseMatrix.transform3(Vector3(
-      viewport.bottomRight.dx,
-      viewport.bottomRight.dy,
-      0.0,
-    )),
-    inverseMatrix.transform3(Vector3(
-      viewport.bottomLeft.dx,
-      viewport.bottomLeft.dy,
-      0.0,
-    )),
+    inverseMatrix.transform3(
+      Vector3(
+        viewport.topLeft.dx,
+        viewport.topLeft.dy,
+        0.0,
+      ),
+    ),
+    inverseMatrix.transform3(
+      Vector3(
+        viewport.topRight.dx,
+        viewport.topRight.dy,
+        0.0,
+      ),
+    ),
+    inverseMatrix.transform3(
+      Vector3(
+        viewport.bottomRight.dx,
+        viewport.bottomRight.dy,
+        0.0,
+      ),
+    ),
+    inverseMatrix.transform3(
+      Vector3(
+        viewport.bottomLeft.dx,
+        viewport.bottomLeft.dy,
+        0.0,
+      ),
+    ),
   );
 }
 
@@ -1451,8 +1515,10 @@ Offset _exceedsBy(Quad boundary, Quad viewport) {
   ];
   Offset largestExcess = Offset.zero;
   for (final Vector3 point in viewportPoints) {
-    final Vector3 pointInside =
-        InteractiveViewer.getNearestPointInside(point, boundary);
+    final Vector3 pointInside = InteractiveViewer.getNearestPointInside(
+      point,
+      boundary,
+    );
     final Offset excess = Offset(
       pointInside.x - point.x,
       pointInside.y - point.y,

lib/common/widgets/interactiveviewer_gallery/interactive_viewer_boundary.dart

@@ -1,4 +1,5 @@
-import 'interactive_viewer.dart' as custom;
+import 'package:PiliPlus/common/widgets/interactiveviewer_gallery/interactive_viewer.dart'
+    as custom;
 import 'package:flutter/material.dart';
 
 /// https://github.com/qq326646683/interactiveviewer_gallery
@@ -212,15 +213,15 @@ class InteractiveViewerBoundaryState extends State<InteractiveViewerBoundary>
   }
 
   Widget get content => DecoratedBoxTransition(
-        decoration: _opacityAnimation,
-        child: SlideTransition(
-          position: _slideAnimation,
-          child: ScaleTransition(
-            scale: _scaleAnimation,
-            child: widget.child,
-          ),
-        ),
-      );
+    decoration: _opacityAnimation,
+    child: SlideTransition(
+      position: _slideAnimation,
+      child: ScaleTransition(
+        scale: _scaleAnimation,
+        child: widget.child,
+      ),
+    ),
+  );
 
   @override
   Widget build(BuildContext context) {

lib/common/widgets/interactiveviewer_gallery/interactiveviewer_gallery.dart

@@ -1,22 +1,20 @@
 import 'dart:io';
 
-import 'package:PiliPlus/http/init.dart';
-import 'package:PiliPlus/utils/download.dart';
+import 'package:PiliPlus/common/widgets/interactiveviewer_gallery/interactive_viewer.dart'
+    as custom;
+import 'package:PiliPlus/common/widgets/interactiveviewer_gallery/interactive_viewer_boundary.dart';
+import 'package:PiliPlus/models/common/image_preview_type.dart';
 import 'package:PiliPlus/utils/extension.dart';
-import 'package:PiliPlus/utils/storage.dart';
+import 'package:PiliPlus/utils/image_util.dart';
+import 'package:PiliPlus/utils/storage_pref.dart';
 import 'package:PiliPlus/utils/utils.dart';
 import 'package:cached_network_image/cached_network_image.dart';
-import 'package:dio/dio.dart';
+import 'package:easy_debounce/easy_throttle.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';
+import 'package:flutter/services.dart';
 import 'package:get/get.dart';
 import 'package:media_kit/media_kit.dart';
 import 'package:media_kit_video/media_kit_video.dart';
-import 'package:path_provider/path_provider.dart';
-import 'package:share_plus/share_plus.dart';
-import 'package:status_bar_control/status_bar_control.dart';
-import 'interactive_viewer_boundary.dart';
-import 'interactive_viewer.dart' as custom;
 
 /// https://github.com/qq326646683/interactiveviewer_gallery
 
@@ -30,29 +28,16 @@ import 'interactive_viewer.dart' as custom;
 /// source is hit after zooming in to disable or enable the swiping gesture of
 /// the [PageView].
 ///
-typedef IndexedFocusedWidgetBuilder = Widget Function(
-    BuildContext context, int index, bool isFocus, bool enablePageView);
+typedef IndexedFocusedWidgetBuilder =
+    Widget Function(
+      BuildContext context,
+      int index,
+      bool isFocus,
+      bool enablePageView,
+    );
 
 typedef IndexedTagStringBuilder = String Function(int index);
 
-enum SourceType { fileImage, networkImage, livePhoto }
-
-class SourceModel {
-  final SourceType sourceType;
-  final String url;
-  final String? liveUrl;
-  final int? width;
-  final int? height;
-
-  const SourceModel({
-    this.sourceType = SourceType.networkImage,
-    required this.url,
-    this.liveUrl,
-    this.width,
-    this.height,
-  });
-}
-
 class InteractiveviewerGallery<T> extends StatefulWidget {
   const InteractiveviewerGallery({
     super.key,
@@ -63,13 +48,16 @@ class InteractiveviewerGallery<T> extends StatefulWidget {
     this.minScale = 1.0,
     this.onPageChanged,
     this.onDismissed,
-    this.setStatusBar,
+    this.setStatusBar = true,
     this.onClose,
+    required this.quality,
   });
 
-  final VoidCallback? onClose;
+  final int quality;
 
-  final bool? setStatusBar;
+  final ValueChanged<bool>? onClose;
+
+  final bool setStatusBar;
 
   /// The sources to show.
   final List<SourceModel> sources;
@@ -111,15 +99,12 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
 
   late final RxInt currentIndex = widget.initIndex.obs;
 
-  late List<bool> _thumbList;
-  late final int _quality = GStorage.previewQ;
+  late final int _quality = Pref.previewQ;
 
   @override
   void initState() {
     super.initState();
 
-    _thumbList = List.generate(widget.sources.length, (_) => true);
-
     _pageController = PageController(initialPage: widget.initIndex);
 
     _transformationController = custom.TransformationController();
@@ -127,43 +112,53 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
     _animationController = AnimationController(
       vsync: this,
       duration: const Duration(milliseconds: 300),
-    )..addListener(() {
-        _transformationController!.value =
-            _animation?.value ?? Matrix4.identity();
-      });
+    )..addListener(listener);
 
-    if (widget.setStatusBar != false) {
+    if (widget.setStatusBar) {
       setStatusBar();
     }
 
-    if (widget.sources[currentIndex.value].sourceType == SourceType.livePhoto) {
-      _onPlay(currentIndex.value);
+    var item = widget.sources[currentIndex.value];
+    if (item.sourceType == SourceType.livePhoto) {
+      _onPlay(item.liveUrl!);
     }
   }
 
-  setStatusBar() async {
+  void listener() {
+    _transformationController!.value = _animation?.value ?? Matrix4.identity();
+  }
+
+  SystemUiMode? mode;
+  Future<void> setStatusBar() async {
     if (Platform.isIOS || Platform.isAndroid) {
-      await StatusBarControl.setHidden(
-        true,
-        animation: StatusBarAnimation.FADE,
+      SystemChrome.setEnabledSystemUIMode(
+        SystemUiMode.immersiveSticky,
       );
     }
+    if (Platform.isAndroid && (await Utils.sdkInt < 29)) {
+      mode = SystemUiMode.manual;
+    }
   }
 
   @override
-  void dispose() async {
+  void dispose() {
+    widget.onClose?.call(true);
     _player?.dispose();
     _pageController?.dispose();
-    _animationController.removeListener(() {});
-    _animationController.dispose();
-    if (widget.setStatusBar != false) {
+    _animationController
+      ..removeListener(listener)
+      ..dispose();
+    if (widget.setStatusBar) {
       if (Platform.isIOS || Platform.isAndroid) {
-        StatusBarControl.setHidden(false, animation: StatusBarAnimation.FADE);
+        SystemChrome.setEnabledSystemUIMode(
+          mode ?? SystemUiMode.edgeToEdge,
+          overlays: SystemUiOverlay.values,
+        );
       }
     }
-    for (int index = 0; index < widget.sources.length; index++) {
-      if (widget.sources[index].sourceType == SourceType.networkImage) {
-        CachedNetworkImageProvider(_getActualUrl(index)).evict();
+    for (var item in widget.sources) {
+      if (item.sourceType == SourceType.networkImage) {
+        CachedNetworkImageProvider(_getActualUrl(item.url)).evict();
       }
     }
     super.dispose();
@@ -222,10 +217,10 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
     }
   }
 
-  void _onPlay(int index) {
+  void _onPlay(String liveUrl) {
     _player ??= Player();
     _videoController ??= VideoController(_player!);
-    _player!.open(Media(widget.sources[index].liveUrl!));
+    _player!.open(Media(liveUrl));
   }
 
   /// When the page view changed its page, the source will animate back into the
@@ -235,31 +230,35 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
   void _onPageChanged(int page) {
     _player?.pause();
     currentIndex.value = page;
-    if (widget.sources[page].sourceType == SourceType.livePhoto) {
-      _onPlay(page);
+    var item = widget.sources[page];
+    if (item.sourceType == SourceType.livePhoto) {
+      _onPlay(item.liveUrl!);
     }
     widget.onPageChanged?.call(page);
     if (_transformationController!.value != Matrix4.identity()) {
       // animate the reset for the transformation of the interactive viewer
 
-      _animation = Matrix4Tween(
-        begin: _transformationController!.value,
-        end: Matrix4.identity(),
-      ).animate(
-        CurveTween(curve: Curves.easeOut).animate(_animationController),
-      );
+      _animation =
+          Matrix4Tween(
+            begin: _transformationController!.value,
+            end: Matrix4.identity(),
+          ).animate(
+            CurveTween(curve: Curves.easeOut).animate(_animationController),
+          );
 
       _animationController.forward(from: 0);
     }
   }
 
-  String _getActualUrl(int index) => _thumbList[index] && _quality != 100
-      ? '${widget.sources[index].url}@${_quality}q.webp'.http2https
-      : widget.sources[index].url.http2https;
+  String _getActualUrl(String url) {
+    return _quality != 100
+        ? ImageUtil.thumbnailUrl(url, _quality)
+        : url.http2https;
+  }
 
   void onClose() {
     if (widget.onClose != null) {
-      widget.onClose!();
+      widget.onClose!(false);
     } else {
       Get.back();
       widget.onDismissed?.call(_pageController!.page!.floor());
@@ -272,10 +271,11 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
   @override
   Widget build(BuildContext context) {
     return Stack(
+      clipBehavior: Clip.none,
       children: [
         InteractiveViewerBoundary(
           controller: _transformationController,
-          boundaryWidth: MediaQuery.of(context).size.width,
+          boundaryWidth: MediaQuery.sizeOf(context).width,
           onScaleChanged: _onScaleChanged,
           onLeftBoundaryHit: _onLeftBoundaryHit,
           onRightBoundaryHit: _onRightBoundaryHit,
@@ -293,21 +293,30 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
           child: PageView.builder(
             onPageChanged: _onPageChanged,
             controller: _pageController,
-            physics:
-                _enablePageView ? null : const NeverScrollableScrollPhysics(),
+            physics: _enablePageView
+                ? null
+                : const NeverScrollableScrollPhysics(),
             itemCount: widget.sources.length,
             itemBuilder: (BuildContext context, int index) {
+              final item = widget.sources[index];
               return GestureDetector(
                 behavior: HitTestBehavior.opaque,
-                onTap: onClose,
+                onTap: () => EasyThrottle.throttle(
+                  'preview',
+                  const Duration(milliseconds: 555),
+                  onClose,
+                ),
                 onDoubleTapDown: (TapDownDetails details) {
                   _doubleTapLocalPosition = details.localPosition;
                 },
-                onDoubleTap: onDoubleTap,
-                onLongPress:
-                    widget.sources[index].sourceType == SourceType.fileImage
-                        ? null
-                        : onLongPress,
+                onDoubleTap: () => EasyThrottle.throttle(
+                  'preview',
+                  const Duration(milliseconds: 555),
+                  onDoubleTap,
+                ),
+                onLongPress: item.sourceType == SourceType.fileImage
+                    ? null
+                    : () => onLongPress(item),
                 child: widget.itemBuilder != null
                     ? widget.itemBuilder!(
                         context,
@@ -315,7 +324,7 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
                         index == currentIndex.value,
                         _enablePageView,
                       )
-                    : _itemBuilder(index),
+                    : _itemBuilder(index, item),
               );
             },
           ),
@@ -325,12 +334,9 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
           left: 0,
           right: 0,
           child: Container(
-            padding: EdgeInsets.fromLTRB(
-              12,
-              8,
-              20,
-              MediaQuery.of(context).padding.bottom + 8,
-            ),
+            padding:
+                MediaQuery.viewPaddingOf(context) +
+                const EdgeInsets.fromLTRB(12, 8, 20, 8),
             decoration: _enablePageView
                 ? BoxDecoration(
                     gradient: LinearGradient(
@@ -338,12 +344,13 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
                       end: Alignment.bottomCenter,
                       colors: [
                         Colors.transparent,
-                        Colors.black.withOpacity(0.3)
+                        Colors.black.withValues(alpha: 0.3),
                       ],
                     ),
                   )
                 : null,
             child: Stack(
+              clipBehavior: Clip.none,
               alignment: Alignment.center,
               children: [
                 Align(
@@ -369,53 +376,40 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
                     alignment: Alignment.centerRight,
                     child: PopupMenuButton(
                       itemBuilder: (context) {
+                        final item = widget.sources[currentIndex.value];
                         return [
                           PopupMenuItem(
-                            onTap: () => onShareImg(
-                                widget.sources[currentIndex.value].url),
+                            onTap: () => ImageUtil.onShareImg(item.url),
                             child: const Text("分享图片"),
                           ),
                           PopupMenuItem(
-                            onTap: () {
-                              Utils.copyText(
-                                  widget.sources[currentIndex.value].url);
-                            },
+                            onTap: () => Utils.copyText(item.url),
                             child: const Text("复制链接"),
                           ),
                           PopupMenuItem(
-                            onTap: () {
-                              DownloadUtils.downloadImg(
-                                context,
-                                [widget.sources[currentIndex.value].url],
-                              );
-                            },
+                            onTap: () => ImageUtil.downloadImg(
+                              this.context,
+                              [item.url],
+                            ),
                             child: const Text("保存图片"),
                           ),
                           if (widget.sources.length > 1)
                             PopupMenuItem(
-                              onTap: () {
-                                DownloadUtils.downloadImg(
-                                  context,
-                                  widget.sources
-                                      .map((item) => item.url)
-                                      .toList(),
-                                );
-                              },
-                              child: const Text("保存全部图片"),
+                              onTap: () => ImageUtil.downloadImg(
+                                this.context,
+                                widget.sources.map((item) => item.url).toList(),
+                              ),
+                              child: const Text("保存全部"),
                             ),
-                          if (widget.sources[currentIndex.value].sourceType ==
-                              SourceType.livePhoto)
+                          if (item.sourceType == SourceType.livePhoto)
                             PopupMenuItem(
                               onTap: () {
-                                DownloadUtils.downloadLivePhoto(
-                                  context: context,
-                                  url: widget.sources[currentIndex.value].url,
-                                  liveUrl: widget
-                                      .sources[currentIndex.value].liveUrl!,
-                                  width:
-                                      widget.sources[currentIndex.value].width!,
-                                  height: widget
-                                      .sources[currentIndex.value].height!,
+                                ImageUtil.downloadLivePhoto(
+                                  context: this.context,
+                                  url: item.url,
+                                  liveUrl: item.liveUrl!,
+                                  width: item.width!,
+                                  height: item.height!,
                                 );
                               },
                               child: const Text("保存 Live Photo"),
@@ -433,65 +427,44 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
     );
   }
 
-  // 图片分享
-  void onShareImg(String imgUrl) async {
-    SmartDialog.showLoading();
-    var response = await Request()
-        .get(imgUrl, options: Options(responseType: ResponseType.bytes));
-    final temp = await getTemporaryDirectory();
-    SmartDialog.dismiss();
-    String imgName =
-        "plpl_pic_${DateTime.now().toString().split('-').join()}.jpg";
-    var path = '${temp.path}/$imgName';
-    File(path).writeAsBytesSync(response.data);
-    Share.shareXFiles([XFile(path)], subject: imgUrl);
-  }
-
-  Widget _itemBuilder(index) {
+  Widget _itemBuilder(int index, SourceModel item) {
     return Center(
       child: Hero(
-        tag: widget.sources[index].url,
-        child: switch (widget.sources[index].sourceType) {
+        tag: item.url,
+        child: switch (item.sourceType) {
           SourceType.fileImage => Image(
-              filterQuality: FilterQuality.low,
-              image: FileImage(File(widget.sources[index].url)),
-            ),
+            filterQuality: FilterQuality.low,
+            image: FileImage(File(item.url)),
+          ),
           SourceType.networkImage => CachedNetworkImage(
-              fadeInDuration: const Duration(milliseconds: 0),
-              fadeOutDuration: const Duration(milliseconds: 0),
-              imageUrl: _getActualUrl(index),
-              // fit: BoxFit.contain,
-              progressIndicatorBuilder: (context, url, progress) {
-                return Center(
-                  child: SizedBox(
-                    width: 150.0,
-                    child:
-                        LinearProgressIndicator(value: progress.progress ?? 0),
-                  ),
-                );
-              },
-              // errorListener: (value) {
-              //   WidgetsBinding.instance.addPostFrameCallback((_) {
-              //     setState(() {
-              //       _thumbList[index] = false;
-              //     });
-              //   });
-              // },
-            ),
-          SourceType.livePhoto => Obx(() => currentIndex.value == index
-              ? IgnorePointer(
-                  child: Video(
-                    controller: _videoController!,
-                    fill: Colors.transparent,
-                  ),
-                )
-              : const SizedBox.shrink()),
+            fadeInDuration: Duration.zero,
+            fadeOutDuration: Duration.zero,
+            imageUrl: _getActualUrl(item.url),
+            placeholderFadeInDuration: Duration.zero,
+            placeholder: (context, url) {
+              return CachedNetworkImage(
+                fadeInDuration: Duration.zero,
+                fadeOutDuration: Duration.zero,
+                imageUrl: ImageUtil.thumbnailUrl(item.url, widget.quality),
+              );
+            },
+          ),
+          SourceType.livePhoto => Obx(
+            () => currentIndex.value == index
+                ? IgnorePointer(
+                    child: Video(
+                      controller: _videoController!,
+                      fill: Colors.transparent,
+                    ),
+                  )
+                : const SizedBox.shrink(),
+          ),
         },
       ),
     );
   }
 
-  onDoubleTap() {
+  void onDoubleTap() {
     Matrix4 matrix = _transformationController!.value.clone();
     double currentScale = matrix.row0.x;
 
@@ -524,34 +497,35 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
       offSetX,
       offSetY,
       matrix.row2.w,
-      matrix.row3.w
+      matrix.row3.w,
     ]);
 
-    _animation = Matrix4Tween(
-      begin: _transformationController!.value,
-      end: matrix,
-    ).animate(
-      CurveTween(curve: Curves.easeOut).animate(_animationController),
-    );
+    _animation =
+        Matrix4Tween(
+          begin: _transformationController!.value,
+          end: matrix,
+        ).animate(
+          CurveTween(curve: Curves.easeOut).animate(_animationController),
+        );
     _animationController
         .forward(from: 0)
         .whenComplete(() => _onScaleChanged(targetScale));
   }
 
-  onLongPress() {
+  void onLongPress(SourceModel item) {
     showDialog(
       context: context,
       builder: (context) {
         return AlertDialog(
           clipBehavior: Clip.hardEdge,
-          contentPadding: const EdgeInsets.fromLTRB(0, 12, 0, 12),
+          contentPadding: const EdgeInsets.symmetric(vertical: 12),
           content: Column(
             mainAxisSize: MainAxisSize.min,
             children: [
               ListTile(
                 onTap: () {
-                  onShareImg(widget.sources[currentIndex.value].url);
                   Get.back();
+                  ImageUtil.onShareImg(item.url);
                 },
                 dense: true,
                 title: const Text('分享', style: TextStyle(fontSize: 14)),
@@ -559,7 +533,7 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
               ListTile(
                 onTap: () {
                   Get.back();
-                  Utils.copyText(widget.sources[currentIndex.value].url);
+                  Utils.copyText(item.url);
                 },
                 dense: true,
                 title: const Text('复制链接', style: TextStyle(fontSize: 14)),
@@ -567,9 +541,9 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
               ListTile(
                 onTap: () {
                   Get.back();
-                  DownloadUtils.downloadImg(
-                    context,
-                    [widget.sources[currentIndex.value].url],
+                  ImageUtil.downloadImg(
+                    this.context,
+                    [item.url],
                   );
                 },
                 dense: true,
@@ -579,25 +553,24 @@ class _InteractiveviewerGalleryState extends State<InteractiveviewerGallery>
                 ListTile(
                   onTap: () {
                     Get.back();
-                    DownloadUtils.downloadImg(
-                      context,
+                    ImageUtil.downloadImg(
+                      this.context,
                       widget.sources.map((item) => item.url).toList(),
                     );
                   },
                   dense: true,
                   title: const Text('保存全部图片', style: TextStyle(fontSize: 14)),
                 ),
-              if (widget.sources[currentIndex.value].sourceType ==
-                  SourceType.livePhoto)
+              if (item.sourceType == SourceType.livePhoto)
                 ListTile(
                   onTap: () {
                     Get.back();
-                    DownloadUtils.downloadLivePhoto(
-                      context: context,
-                      url: widget.sources[currentIndex.value].url,
-                      liveUrl: widget.sources[currentIndex.value].liveUrl!,
-                      width: widget.sources[currentIndex.value].width!,
-                      height: widget.sources[currentIndex.value].height!,
+                    ImageUtil.downloadLivePhoto(
+                      context: this.context,
+                      url: item.url,
+                      liveUrl: item.liveUrl!,
+                      width: item.width!,
+                      height: item.height!,
                     );
                   },
                   dense: true,