Fix windows build error

Fix desktop backup error

.github/workflows/build.yml

@@ -15,10 +15,16 @@ jobs:
             os: ubuntu-latest
           - platform: windows
             os: windows-latest
+            arch: amd64
           - platform: linux
             os: ubuntu-latest
+            arch: amd64
           - platform: macos
             os: macos-13
+            arch: amd64
+          - platform: macos
+            os: macos-latest
+            arch: arm64
 
     steps:
       - name: Setup Mingw64
@@ -89,13 +95,12 @@ jobs:
         run: flutter pub get
 
       - name: Setup
-        run: |
+        run: dart setup.dart ${{ matrix.platform }} ${{ matrix.arch && format('--arch {0}', matrix.arch) }}
-          dart setup.dart ${{ matrix.platform }}
 
       - name: Upload
         uses: actions/upload-artifact@v4
         with:
-          name: artifact-${{ matrix.platform }}
+          name: artifact-${{ matrix.platform }}${{ matrix.arch && format('-{0}', matrix.arch) }}
           path: ./dist
           retention-days: 1
           overwrite: true

android/app/src/main/AndroidManifest.xml

@@ -24,8 +24,9 @@
         android:icon="@mipmap/ic_launcher"
         android:networkSecurityConfig="@xml/network_security_config"
         android:extractNativeLibs="true"
+        android:enableOnBackInvokedCallback="true"
         android:label="FlClash"
-        tools:targetApi="n">
+        tools:targetApi="tiramisu">
         <activity
             android:name="com.follow.clash.MainActivity"
             android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
@@ -74,7 +75,7 @@
         <service
             android:name=".services.FlClashTileService"
             android:exported="true"
-            android:icon="@drawable/icon"
+            android:icon="@drawable/ic_stat_name"
             android:foregroundServiceType="specialUse"
             android:label="FlClash"
             android:permission="android.permission.BIND_QUICK_SETTINGS_TILE">

android/app/src/main/kotlin/com/follow/clash/GlobalState.kt

@@ -1,10 +1,16 @@
 package com.follow.clash
 
+import android.content.Context
+import android.util.Log
 import androidx.lifecycle.MutableLiveData
 import com.follow.clash.plugins.AppPlugin
+import com.follow.clash.plugins.ProxyPlugin
 import com.follow.clash.plugins.TilePlugin
+import io.flutter.FlutterInjector
 import io.flutter.embedding.engine.FlutterEngine
-import java.util.Date
+import io.flutter.embedding.engine.dart.DartExecutor
+import java.util.concurrent.locks.ReentrantLock
+import kotlin.concurrent.withLock
 
 enum class RunState {
     START,
@@ -12,16 +18,48 @@ enum class RunState {
     STOP
 }
 
-class GlobalState {
-    companion object {
-        val runState: MutableLiveData<RunState> = MutableLiveData<RunState>(RunState.STOP)
-        var runTime: Date? = null
-        var flutterEngine: FlutterEngine? = null
-        fun getCurrentTilePlugin(): TilePlugin? =
-            flutterEngine?.plugins?.get(TilePlugin::class.java) as TilePlugin?
 
-        fun getCurrentAppPlugin(): AppPlugin? =
+object GlobalState {
-            flutterEngine?.plugins?.get(AppPlugin::class.java) as AppPlugin?
+
+    private val lock = ReentrantLock()
+
+    val runState: MutableLiveData<RunState> = MutableLiveData<RunState>(RunState.STOP)
+    var flutterEngine: FlutterEngine? = null
+    private var serviceEngine: FlutterEngine? = null
+
+    fun getCurrentAppPlugin(): AppPlugin? {
+        val currentEngine = if (flutterEngine != null) flutterEngine else serviceEngine
+        return currentEngine?.plugins?.get(AppPlugin::class.java) as AppPlugin?
+    }
+
+    fun getCurrentTitlePlugin(): TilePlugin? {
+        val currentEngine = if (flutterEngine != null) flutterEngine else serviceEngine
+        return currentEngine?.plugins?.get(TilePlugin::class.java) as TilePlugin?
+    }
+
+    fun destroyServiceEngine() {
+        serviceEngine?.destroy()
+        serviceEngine = null
+    }
+
+    fun initServiceEngine(context: Context) {
+        if (serviceEngine != null) return
+        lock.withLock {
+            destroyServiceEngine()
+            serviceEngine = FlutterEngine(context)
+            serviceEngine?.plugins?.add(ProxyPlugin())
+            serviceEngine?.plugins?.add(AppPlugin())
+            serviceEngine?.plugins?.add(TilePlugin())
+            val vpnService = DartExecutor.DartEntrypoint(
+                FlutterInjector.instance().flutterLoader().findAppBundlePath(),
+                "vpnService"
+            )
+            serviceEngine?.dartExecutor?.executeDartEntrypoint(
+                vpnService,
+            )
+
+            Log.e("FlClashVpnService", "initServiceEngine ===>")
+        }
     }
 }
 

android/app/src/main/kotlin/com/follow/clash/MainActivity.kt

@@ -10,7 +10,6 @@ import io.flutter.embedding.engine.FlutterEngine
 class MainActivity : FlutterActivity() {
 
     override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
-        GlobalState.flutterEngine?.destroy()
         super.configureFlutterEngine(flutterEngine)
         flutterEngine.plugins.add(AppPlugin())
         flutterEngine.plugins.add(ProxyPlugin())

android/app/src/main/kotlin/com/follow/clash/plugins/AppPlugin.kt

@@ -2,27 +2,27 @@ package com.follow.clash.plugins
 
 import android.Manifest
 import android.app.Activity
+import android.app.ActivityManager
 import android.content.Context
 import android.content.pm.ApplicationInfo
 import android.content.pm.PackageManager
 import android.net.ConnectivityManager
-import android.net.Uri
 import android.os.Build
 import android.widget.Toast
-import androidx.annotation.RequiresApi
+import androidx.core.content.ContextCompat.getSystemService
 import androidx.core.content.getSystemService
-import androidx.core.graphics.drawable.toBitmap
+import com.follow.clash.GlobalState
 import com.follow.clash.extensions.getBase64
-import com.follow.clash.extensions.getInetSocketAddress
 import com.follow.clash.extensions.getProtocol
-import com.follow.clash.models.Process
 import com.follow.clash.models.Package
+import com.follow.clash.models.Process
 import com.google.gson.Gson
 import io.flutter.embedding.engine.plugins.FlutterPlugin
 import io.flutter.embedding.engine.plugins.activity.ActivityAware
 import io.flutter.embedding.engine.plugins.activity.ActivityPluginBinding
 import io.flutter.plugin.common.MethodCall
 import io.flutter.plugin.common.MethodChannel
+import io.flutter.plugin.common.MethodChannel.Result
 import kotlinx.coroutines.CoroutineScope
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.cancel
@@ -30,6 +30,7 @@ import kotlinx.coroutines.launch
 import kotlinx.coroutines.withContext
 import java.net.InetSocketAddress
 
+
 class AppPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAware {
 
     private var activity: Activity? = null
@@ -47,30 +48,41 @@ class AppPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAware
     private val iconMap = mutableMapOf<String, String?>()
 
     override fun onAttachedToEngine(flutterPluginBinding: FlutterPlugin.FlutterPluginBinding) {
+        scope = CoroutineScope(Dispatchers.Default)
         context = flutterPluginBinding.applicationContext;
         channel = MethodChannel(flutterPluginBinding.binaryMessenger, "app")
         channel.setMethodCallHandler(this)
+
     }
 
     override fun onDetachedFromEngine(binding: FlutterPlugin.FlutterPluginBinding) {
         channel.setMethodCallHandler(null)
+        scope.cancel()
     }
 
     private fun tip(message: String?) {
-        if (toast != null) {
+        if(GlobalState.flutterEngine == null){
-            toast!!.cancel()
+            if (toast != null) {
+                toast!!.cancel()
+            }
+            toast = Toast.makeText(context, message, Toast.LENGTH_SHORT)
+            toast!!.show()
         }
-        toast = Toast.makeText(context, message, Toast.LENGTH_SHORT)
-        toast!!.show()
     }
 
-    override fun onMethodCall(call: MethodCall, result: MethodChannel.Result) {
+    override fun onMethodCall(call: MethodCall, result: Result) {
         when (call.method) {
             "moveTaskToBack" -> {
                 activity?.moveTaskToBack(true)
                 result.success(true);
             }
 
+            "updateExcludeFromRecents" -> {
+                val value = call.argument<Boolean>("value")
+                updateExcludeFromRecents(value)
+                result.success(true);
+            }
+
             "getPackages" -> {
                 scope.launch {
                     result.success(getPackages())
@@ -115,7 +127,7 @@ class AppPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAware
                 }
                 scope.launch {
                     withContext(Dispatchers.Default) {
-                        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.Q){
+                        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.Q) {
                             result.success(null)
                             return@withContext
                         }
@@ -158,6 +170,24 @@ class AppPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAware
         }
     }
 
+    private fun updateExcludeFromRecents(value: Boolean?) {
+        if (context == null) return
+        val am = getSystemService(context!!, ActivityManager::class.java)
+        val task = am?.appTasks?.firstOrNull {
+            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+                it.taskInfo.taskId == activity?.taskId
+            } else {
+                it.taskInfo.id == activity?.taskId
+            }
+        }
+
+        when (value) {
+            true -> task?.setExcludeFromRecents(value)
+            false -> task?.setExcludeFromRecents(value)
+            null -> task?.setExcludeFromRecents(false)
+        }
+    }
+
     private suspend fun getPackageIcon(packageName: String): String? {
         val packageManager = context?.packageManager
         if (iconMap[packageName] == null) {
@@ -197,11 +227,10 @@ class AppPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAware
 
     override fun onAttachedToActivity(binding: ActivityPluginBinding) {
         activity = binding.activity;
-        scope = CoroutineScope(Dispatchers.Default)
     }
 
     override fun onDetachedFromActivityForConfigChanges() {
-        activity = null;
+        activity = null
     }
 
     override fun onReattachedToActivityForConfigChanges(binding: ActivityPluginBinding) {
@@ -210,7 +239,6 @@ class AppPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAware
 
     override fun onDetachedFromActivity() {
         channel.invokeMethod("exit", null)
-        scope.cancel()
+        activity = null
-        activity = null;
     }
 }

android/app/src/main/kotlin/com/follow/clash/plugins/ProxyPlugin.kt

@@ -1,7 +1,6 @@
 package com.follow.clash.plugins
 
 import android.Manifest
-import android.annotation.SuppressLint
 import android.app.Activity
 import android.content.ComponentName
 import android.content.Context
@@ -9,9 +8,9 @@ import android.content.Intent
 import android.content.ServiceConnection
 import android.content.pm.PackageManager
 import android.net.VpnService
-import android.os.Build.VERSION
+import android.os.Build
-import android.os.Build.VERSION_CODES
 import android.os.IBinder
+import android.util.Log
 import androidx.core.app.ActivityCompat
 import androidx.core.content.ContextCompat
 import com.follow.clash.GlobalState
@@ -25,38 +24,36 @@ import io.flutter.embedding.engine.plugins.activity.ActivityAware
 import io.flutter.embedding.engine.plugins.activity.ActivityPluginBinding
 import io.flutter.plugin.common.MethodCall
 import io.flutter.plugin.common.MethodChannel
-import java.util.Date
 
 
 class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAware {
 
+    private lateinit var flutterMethodChannel: MethodChannel
 
     val VPN_PERMISSION_REQUEST_CODE = 1001
     val NOTIFICATION_PERMISSION_REQUEST_CODE = 1002
 
-    private lateinit var flutterMethodChannel: MethodChannel
-
     private var activity: Activity? = null
     private var context: Context? = null
     private var flClashVpnService: FlClashVpnService? = null
-    private var isBound = false
+    private var port: Int = 7890
-    private var port: Int? = null
     private var props: Props? = null
-    private lateinit var title: String
+    private var isBlockNotification: Boolean = false
-    private lateinit var content: String
+    private var isStart: Boolean = false
-    var isBlockNotification: Boolean = false
 
     private val connection = object : ServiceConnection {
         override fun onServiceConnected(className: ComponentName, service: IBinder) {
             val binder = service as FlClashVpnService.LocalBinder
             flClashVpnService = binder.getService()
-            port?.let { startVpn(it) }
+            if (isStart) {
-            isBound = true
+                startVpn()
+            } else {
+                flClashVpnService?.initServiceEngine()
+            }
         }
 
-        override fun onServiceDisconnected(arg0: ComponentName) {
+        override fun onServiceDisconnected(arg: ComponentName) {
             flClashVpnService = null
-            isBound = false
         }
     }
 
@@ -71,21 +68,29 @@ class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAwar
     }
 
     override fun onMethodCall(call: MethodCall, result: MethodChannel.Result) = when (call.method) {
-        "StartProxy" -> {
+        "initService" -> {
-            port = call.argument<Int>("port")
+            isStart = false
-            val args = call.argument<String>("args")
+            initService()
-            props =
+            requestNotificationsPermission()
-                if (args != null) Gson().fromJson(args, Props::class.java) else null
-            handleStartVpn()
             result.success(true)
         }
 
-        "StopProxy" -> {
+        "startProxy" -> {
+            isStart = true
+            port = call.argument<Int>("port")!!
+            val args = call.argument<String>("args")
+            props =
+                if (args != null) Gson().fromJson(args, Props::class.java) else null
+            startVpn()
+            result.success(true)
+        }
+
+        "stopProxy" -> {
             stopVpn()
             result.success(true)
         }
 
-        "SetProtect" -> {
+        "setProtect" -> {
             val fd = call.argument<Int>("fd")
             if (fd != null) {
                 flClashVpnService?.protect(fd)
@@ -95,14 +100,10 @@ class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAwar
             }
         }
 
-        "GetRunTimeStamp" -> {
-            result.success(GlobalState.runTime?.time)
-        }
-
         "startForeground" -> {
-            title = call.argument<String>("title") as String
+            val title = call.argument<String>("title") as String
-            content = call.argument<String>("content") as String
+            val content = call.argument<String>("content") as String
-            requestNotificationsPermission()
+            startForeground(title, content)
             result.success(true)
         }
 
@@ -111,65 +112,47 @@ class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAwar
         }
     }
 
-    private fun handleStartVpn() {
+    private fun initService() {
         val intent = VpnService.prepare(context)
         if (intent != null) {
             activity?.startActivityForResult(intent, VPN_PERMISSION_REQUEST_CODE)
         } else {
-            bindService()
+            if (flClashVpnService != null) {
+                flClashVpnService!!.initServiceEngine()
+            } else {
+                bindService()
+            }
         }
     }
 
-    private fun startVpn(port: Int) {
+    private fun startVpn() {
-        if (GlobalState.runState.value == RunState.START) return;
+        if (flClashVpnService == null) {
-        flClashVpnService?.start(port, props)
+            bindService()
+            return
+        }
+        if (GlobalState.runState.value == RunState.START) return
         GlobalState.runState.value = RunState.START
-        GlobalState.runTime = Date()
+        val intent = VpnService.prepare(context)
-        startAfter()
+        if (intent != null) {
+            stopVpn()
+            return
+        }
+        val fd = flClashVpnService?.start(port, props)
+        flutterMethodChannel.invokeMethod("started", fd)
     }
 
     private fun stopVpn() {
         if (GlobalState.runState.value == RunState.STOP) return
+        GlobalState.runState.value = RunState.STOP
         flClashVpnService?.stop()
-        unbindService()
+        GlobalState.destroyServiceEngine()
-        GlobalState.runState.value = RunState.STOP;
-        GlobalState.runTime = null;
     }
 
-    private fun startForeground() {
+    private fun startForeground(title: String, content: String) {
         if (GlobalState.runState.value != RunState.START) return
         flClashVpnService?.startForeground(title, content)
     }
 
-    private fun requestNotificationsPermission() {
-        if (VERSION.SDK_INT >= VERSION_CODES.TIRAMISU) {
-            val permission = context?.let {
-                ContextCompat.checkSelfPermission(
-                    it,
-                    Manifest.permission.POST_NOTIFICATIONS
-                )
-            }
-            if (permission == PackageManager.PERMISSION_GRANTED) {
-                startForeground()
-            } else {
-                if (isBlockNotification) return
-                if (activity == null) return
-                ActivityCompat.requestPermissions(
-                    activity!!,
-                    arrayOf(Manifest.permission.POST_NOTIFICATIONS),
-                    NOTIFICATION_PERMISSION_REQUEST_CODE
-                )
-
-            }
-        } else {
-            startForeground()
-        }
-    }
-
-    private fun startAfter() {
-        flutterMethodChannel.invokeMethod("startAfter", flClashVpnService?.fd)
-    }
-
     override fun onAttachedToActivity(binding: ActivityPluginBinding) {
         activity = binding.activity
         binding.addActivityResultListener(::onActivityResult)
@@ -184,7 +167,7 @@ class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAwar
                 stopVpn()
             }
         }
-        return true;
+        return true
     }
 
     private fun onRequestPermissionsResultListener(
@@ -194,18 +177,32 @@ class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAwar
     ): Boolean {
         if (requestCode == NOTIFICATION_PERMISSION_REQUEST_CODE) {
             isBlockNotification = true
-            if (grantResults.isNotEmpty()) {
-                if (grantResults[0] == PackageManager.PERMISSION_GRANTED) {
-                    startForeground()
-                }
-            }
         }
-        return false;
+        return false
     }
 
+    private fun requestNotificationsPermission() {
+        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.TIRAMISU) {
+            val permission = context?.let {
+                ContextCompat.checkSelfPermission(
+                    it,
+                    Manifest.permission.POST_NOTIFICATIONS
+                )
+            }
+            if (permission != PackageManager.PERMISSION_GRANTED) {
+                if (isBlockNotification) return
+                if (activity == null) return
+                ActivityCompat.requestPermissions(
+                    activity!!,
+                    arrayOf(Manifest.permission.POST_NOTIFICATIONS),
+                    NOTIFICATION_PERMISSION_REQUEST_CODE
+                )
+            }
+        }
+    }
 
     override fun onDetachedFromActivityForConfigChanges() {
-        activity = null;
+        activity = null
     }
 
     override fun onReattachedToActivityForConfigChanges(binding: ActivityPluginBinding) {
@@ -213,7 +210,6 @@ class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAwar
     }
 
     override fun onDetachedFromActivity() {
-        stopVpn()
         activity = null
     }
 
@@ -221,11 +217,4 @@ class ProxyPlugin : FlutterPlugin, MethodChannel.MethodCallHandler, ActivityAwar
         val intent = Intent(context, FlClashVpnService::class.java)
         context?.bindService(intent, connection, Context.BIND_AUTO_CREATE)
     }
-
-    private fun unbindService() {
-        if (isBound) {
-            context?.unbindService(connection)
-            isBound = false
-        }
-    }
 }

android/app/src/main/kotlin/com/follow/clash/plugins/TilePlugin.kt

@@ -1,3 +1,4 @@
+
 package com.follow.clash.plugins
 
 import io.flutter.embedding.engine.plugins.FlutterPlugin

android/app/src/main/kotlin/com/follow/clash/services/FlClashTileService.kt

@@ -1,9 +1,9 @@
 package com.follow.clash.services
 
-import android.annotation.SuppressLint
 import android.app.PendingIntent
 import android.content.Intent
 import android.os.Build
+import android.os.IBinder
 import android.service.quicksettings.Tile
 import android.service.quicksettings.TileService
 import androidx.annotation.RequiresApi
@@ -11,14 +11,9 @@ import androidx.lifecycle.Observer
 import com.follow.clash.GlobalState
 import com.follow.clash.RunState
 import com.follow.clash.TempActivity
-import com.follow.clash.plugins.AppPlugin
-import com.follow.clash.plugins.ProxyPlugin
-import com.follow.clash.plugins.TilePlugin
-import io.flutter.FlutterInjector
-import io.flutter.embedding.engine.FlutterEngine
-import io.flutter.embedding.engine.dart.DartExecutor
 
 
+@RequiresApi(Build.VERSION_CODES.N)
 class FlClashTileService : TileService() {
 
     private val observer = Observer<RunState> { runState ->
@@ -62,42 +57,25 @@ class FlClashTileService : TileService() {
         }
         if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.UPSIDE_DOWN_CAKE) {
             startActivityAndCollapse(pendingIntent)
-        }else{
+        } else {
             startActivityAndCollapse(intent)
         }
     }
 
-    private var flutterEngine: FlutterEngine? = null;
-
-    private fun initFlutterEngine() {
-        flutterEngine = FlutterEngine(this)
-        flutterEngine?.plugins?.add(ProxyPlugin())
-        flutterEngine?.plugins?.add(TilePlugin())
-        flutterEngine?.plugins?.add(AppPlugin())
-        GlobalState.flutterEngine = flutterEngine
-        if (flutterEngine?.dartExecutor?.isExecutingDart != true) {
-            val vpnService = DartExecutor.DartEntrypoint(
-                FlutterInjector.instance().flutterLoader().findAppBundlePath(),
-                "vpnService"
-            )
-            flutterEngine?.dartExecutor?.executeDartEntrypoint(vpnService)
-        }
-    }
-
     override fun onClick() {
         super.onClick()
         activityTransfer()
-        val currentTilePlugin = GlobalState.getCurrentTilePlugin()
         if (GlobalState.runState.value == RunState.STOP) {
             GlobalState.runState.value = RunState.PENDING
-            if(currentTilePlugin == null){
+            val titlePlugin = GlobalState.getCurrentTitlePlugin()
-                initFlutterEngine()
+            if (titlePlugin != null) {
-            }else{
+                titlePlugin.handleStart()
-                currentTilePlugin.handleStart()
+            } else {
+                GlobalState.initServiceEngine(applicationContext)
             }
-        } else if(GlobalState.runState.value == RunState.START){
+        } else if (GlobalState.runState.value == RunState.START) {
             GlobalState.runState.value = RunState.PENDING
-            currentTilePlugin?.handleStop()
+            GlobalState.getCurrentTitlePlugin()?.handleStop()
         }
 
     }

android/app/src/main/kotlin/com/follow/clash/services/FlClashVpnService.kt

@@ -11,20 +11,23 @@ import android.net.VpnService
 import android.os.Binder
 import android.os.Build
 import android.os.IBinder
+import android.os.Parcel
+import android.os.RemoteException
+import android.util.Log
 import androidx.core.app.NotificationCompat
 import com.follow.clash.GlobalState
 import com.follow.clash.MainActivity
 import com.follow.clash.R
 import com.follow.clash.models.AccessControlMode
 import com.follow.clash.models.Props
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
 
 
 class FlClashVpnService : VpnService() {
-
-
     private val CHANNEL = "FlClash"
 
-    var fd: Int? = null
     private val notificationId: Int = 1
 
     private val passList = listOf(
@@ -47,12 +50,13 @@ class FlClashVpnService : VpnService() {
         "192.168.*"
     )
 
-    override fun onStartCommand(intent: Intent?, flags: Int, startId: Int): Int {
+    override fun onCreate() {
-        return START_STICKY
+        super.onCreate()
+        initServiceEngine()
     }
 
-    fun start(port: Int, props: Props?) {
+    fun start(port: Int, props: Props?): Int? {
-        fd = with(Builder()) {
+        return with(Builder()) {
             addAddress("172.16.0.1", 30)
             setMtu(9000)
             addRoute("0.0.0.0", 0)
@@ -98,7 +102,6 @@ class FlClashVpnService : VpnService() {
         stopForeground()
     }
 
-
     private val notificationBuilder: NotificationCompat.Builder by lazy {
         val intent = Intent(this, MainActivity::class.java)
 
@@ -117,7 +120,6 @@ class FlClashVpnService : VpnService() {
                 PendingIntent.FLAG_UPDATE_CURRENT
             )
         }
-
         with(NotificationCompat.Builder(this, CHANNEL)) {
             setSmallIcon(R.drawable.ic_stat_name)
             setContentTitle("FlClash")
@@ -130,10 +132,14 @@ class FlClashVpnService : VpnService() {
             setOngoing(true)
             setShowWhen(false)
             setOnlyAlertOnce(true)
-            setAutoCancel(true);
+            setAutoCancel(true)
         }
     }
 
+    fun initServiceEngine() {
+        GlobalState.initServiceEngine(applicationContext)
+    }
+
     override fun onTrimMemory(level: Int) {
         super.onTrimMemory(level)
         GlobalState.getCurrentAppPlugin()?.requestGc()
@@ -168,14 +174,28 @@ class FlClashVpnService : VpnService() {
 
     inner class LocalBinder : Binder() {
         fun getService(): FlClashVpnService = this@FlClashVpnService
+
+        override fun onTransact(code: Int, data: Parcel, reply: Parcel?, flags: Int): Boolean {
+            try {
+                val isSuccess = super.onTransact(code, data, reply, flags)
+                if (!isSuccess) {
+                    CoroutineScope(Dispatchers.Main).launch {
+                        GlobalState.getCurrentTitlePlugin()?.handleStop()
+                    }
+                }
+                return isSuccess
+            } catch (e: RemoteException) {
+                throw e
+            }
+        }
     }
 
+
     override fun onBind(intent: Intent): IBinder {
         return binder
     }
 
     override fun onUnbind(intent: Intent?): Boolean {
-        GlobalState.getCurrentTilePlugin()?.handleStop();
         return super.onUnbind(intent)
     }
 

android/app/src/main/res/drawable/ic_launcher_foreground.xml

@@ -0,0 +1,25 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="108dp"
+    android:height="108dp"
+    android:viewportWidth="240"
+    android:viewportHeight="240">
+  <group android:scaleX="0.924"
+      android:scaleY="0.924"
+      android:translateX="9.12"
+      android:translateY="9.12">
+    <group android:scaleX="0.63461536"
+        android:scaleY="0.63461536"
+        android:translateX="45.96154"
+        android:translateY="43.846153">
+      <path
+          android:pathData="M60.65,89.6L154.18,35.6A18,18 107.59,0 1,178.77 42.19L178.77,42.19A18,18 107.59,0 1,172.18 66.78L78.65,120.78A18,18 106.67,0 1,54.06 114.19L54.06,114.19A18,18 106.67,0 1,60.65 89.6z"
+          android:fillColor="#6666FB"/>
+      <path
+          android:pathData="M84.65,131.17L131.42,104.17A18,18 107.83,0 1,156 110.76L156,110.76A18,18 107.83,0 1,149.42 135.35L102.65,162.35A18,18 106.67,0 1,78.06 155.76L78.06,155.76A18,18 106.67,0 1,84.65 131.17z"
+          android:fillColor="#336AB6"/>
+      <path
+          android:pathData="M108.65,172.74L108.65,172.74A18,18 116.03,0 1,133.24 179.33L133.24,179.33A18,18 116.03,0 1,126.65 203.92L126.65,203.92A18,18 116.03,0 1,102.06 197.33L102.06,197.33A18,18 116.03,0 1,108.65 172.74z"
+          android:fillColor="#5CA8E9"/>
+    </group>
+  </group>
+</vector>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
     <background android:drawable="@color/ic_launcher_background"/>
-    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+    <foreground android:drawable="@drawable/ic_launcher_foreground"/>
-    <monochrome android:drawable="@mipmap/ic_launcher_foreground" />
+    <monochrome android:drawable="@drawable/ic_launcher_foreground" />
 </adaptive-icon>

android/app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
     <background android:drawable="@color/ic_launcher_background"/>
-    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
+    <foreground android:drawable="@drawable/ic_launcher_foreground"/>
-    <monochrome android:drawable="@mipmap/ic_launcher_foreground" />
+    <monochrome android:drawable="@drawable/ic_launcher_foreground" />
 </adaptive-icon>

android/app/src/main/res/values-night-v27/styles.xml

@@ -6,7 +6,7 @@
         <item name="android:windowDrawsSystemBarBackgrounds">false</item>
         <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
         <item name="android:windowSplashScreenBackground" tools:targetApi="s">#121212</item>
-        <item name="android:windowSplashScreenAnimatedIcon" tools:targetApi="s">@mipmap/ic_launcher_foreground</item>
+        <item name="android:windowSplashScreenAnimatedIcon" tools:targetApi="s">@drawable/ic_launcher_foreground</item>
         <item name="postSplashScreenTheme">@style/NormalTheme</item>
     </style>
 </resources>

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

@@ -6,7 +6,7 @@
         <item name="android:windowDrawsSystemBarBackgrounds">false</item>
         <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
         <item name="android:windowSplashScreenBackground" tools:targetApi="s">@color/ic_launcher_background</item>
-        <item name="android:windowSplashScreenAnimatedIcon" tools:targetApi="s">@mipmap/ic_launcher_foreground</item>
+        <item name="android:windowSplashScreenAnimatedIcon" tools:targetApi="s">@drawable/ic_launcher_foreground</item>
         <item name="postSplashScreenTheme">@style/NormalTheme</item>
     </style>
 </resources>

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

@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="ic_launcher_background">#EFEFEF</color>
+    <color name="ic_launcher_background">#FAFAFA</color>
 </resources>

core/common.go

@@ -21,6 +21,7 @@ import (
 	"path/filepath"
 	"runtime"
 	"strings"
+	"sync"
 	"syscall"
 	"time"
 )
@@ -83,26 +84,11 @@ type TestDelayParams struct {
 	Timeout   int64  `json:"timeout"`
 }
 
-type Delay struct {
-	Name  string `json:"name"`
-	Value int32  `json:"value"`
-}
-
-type Process struct {
-	Id       int64              `json:"id"`
-	Metadata *constant.Metadata `json:"metadata"`
-}
-
 type ProcessMapItem struct {
 	Id    int64  `json:"id"`
 	Value string `json:"value"`
 }
 
-type Now struct {
-	Name  string `json:"name"`
-	Value string `json:"value"`
-}
-
 type ExternalProvider struct {
 	Name        string    `json:"name"`
 	Type        string    `json:"type"`
@@ -336,7 +322,7 @@ func overwriteConfig(targetConfig *config.RawConfig, patchConfig config.RawConfi
 	targetConfig.ExternalUIURL = ""
 	targetConfig.TCPConcurrent = patchConfig.TCPConcurrent
 	targetConfig.UnifiedDelay = patchConfig.UnifiedDelay
-	targetConfig.GeodataMode = false
+	//targetConfig.GeodataMode = false
 	targetConfig.IPv6 = patchConfig.IPv6
 	targetConfig.LogLevel = patchConfig.LogLevel
 	targetConfig.Port = 0
@@ -351,6 +337,8 @@ func overwriteConfig(targetConfig *config.RawConfig, patchConfig config.RawConfi
 	targetConfig.Tun.Stack = patchConfig.Tun.Stack
 	targetConfig.GeodataLoader = patchConfig.GeodataLoader
 	targetConfig.Profile.StoreSelected = false
+	targetConfig.GeoXUrl = patchConfig.GeoXUrl
+	targetConfig.GlobalUA = patchConfig.GlobalUA
 	if targetConfig.DNS.Enable == false {
 		targetConfig.DNS = patchConfig.DNS
 	}
@@ -420,7 +408,11 @@ func patchSelectGroup() {
 	}
 }
 
+var applyLock sync.Mutex
+
 func applyConfig() {
+	applyLock.Lock()
+	defer applyLock.Unlock()
 	cfg, err := config.ParseRawConfig(currentConfig)
 	if err != nil {
 		cfg, _ = config.ParseRawConfig(config.DefaultRawConfig())

core/dart-bridge/lib.go

@@ -25,7 +25,7 @@ func InitDartApi(api unsafe.Pointer) {
 	}
 }
 
-func SendToPort(port int64, msg string) {
+func SendToPort(port int64, msg string) bool {
 	var obj C.Dart_CObject
 	obj._type = C.Dart_CObject_kString
 	msgString := C.CString(msg)
@@ -34,6 +34,7 @@ func SendToPort(port int64, msg string) {
 	*(**C.char)(ptr) = msgString
 	isSuccess := C.GoDart_PostCObject(C.Dart_Port_DL(port), &obj)
 	if !isSuccess {
-		fmt.Println("ERROR: post to port ", port, " failed", msg)
+		return false
 	}
+	return true
 }

core/dart-bridge/message.go

@@ -1,39 +0,0 @@
-package dart_bridge
-
-import "encoding/json"
-
-var Port *int64
-
-type MessageType string
-
-const (
-	Log     MessageType = "log"
-	Tun     MessageType = "tun"
-	Delay   MessageType = "delay"
-	Now     MessageType = "now"
-	Process MessageType = "process"
-	Request MessageType = "request"
-	Run     MessageType = "run"
-	Loaded  MessageType = "loaded"
-)
-
-type Message struct {
-	Type MessageType `json:"type"`
-	Data interface{} `json:"data"`
-}
-
-func (message *Message) Json() (string, error) {
-	data, err := json.Marshal(message)
-	return string(data), err
-}
-
-func SendMessage(message Message) {
-	if Port == nil {
-		return
-	}
-	s, err := message.Json()
-	if err != nil {
-		return
-	}
-	SendToPort(*Port, s)
-}

core/go.mod

@@ -7,8 +7,8 @@ replace github.com/metacubex/mihomo => ./Clash.Meta
 require (
 	github.com/Kr328/tun2socket v0.0.0-20220414050025-d07c78d06d34
 	github.com/metacubex/mihomo v1.17.1
-	github.com/miekg/dns v1.1.59
+	github.com/miekg/dns v1.1.61
-	golang.org/x/net v0.25.0
+	golang.org/x/net v0.26.0
 	golang.org/x/sync v0.7.0
 )
 
@@ -31,7 +31,7 @@ require (
 	github.com/ericlagergren/subtle v0.0.0-20220507045147-890d697da010 // indirect
 	github.com/fsnotify/fsnotify v1.7.0 // indirect
 	github.com/gaukas/godicttls v0.0.4 // indirect
-	github.com/go-chi/chi/v5 v5.0.12 // indirect
+	github.com/go-chi/chi/v5 v5.0.14 // indirect
 	github.com/go-chi/cors v1.2.1 // indirect
 	github.com/go-chi/render v1.0.3 // indirect
 	github.com/go-ole/go-ole v1.3.0 // indirect
@@ -44,10 +44,10 @@ require (
 	github.com/google/go-cmp v0.6.0 // indirect
 	github.com/google/pprof v0.0.0-20210407192527-94a9f03dee38 // indirect
 	github.com/hashicorp/yamux v0.1.1 // indirect
-	github.com/insomniacslk/dhcp v0.0.0-20240419123447-f1cffa2c0c49 // indirect
+	github.com/insomniacslk/dhcp v0.0.0-20240529192340-51bc6136a0a6 // indirect
 	github.com/josharian/native v1.1.0 // indirect
 	github.com/klauspost/compress v1.17.4 // indirect
-	github.com/klauspost/cpuid/v2 v2.2.7 // indirect
+	github.com/klauspost/cpuid/v2 v2.2.8 // indirect
 	github.com/lufia/plan9stats v0.0.0-20211012122336-39d0f177ccd0 // indirect
 	github.com/lunixbochs/struc v0.0.0-20200707160740-784aaebc1d40 // indirect
 	github.com/mailru/easyjson v0.7.7 // indirect
@@ -55,13 +55,14 @@ require (
 	github.com/mdlayher/socket v0.4.1 // indirect
 	github.com/metacubex/gopacket v1.1.20-0.20230608035415-7e2f98a3e759 // indirect
 	github.com/metacubex/gvisor v0.0.0-20240320004321-933faba989ec // indirect
-	github.com/metacubex/quic-go v0.43.2-0.20240518033621-2c3d14c6b38e // indirect
+	github.com/metacubex/quic-go v0.45.1-0.20240610004319-163fee60637e // indirect
+	github.com/metacubex/randv2 v0.2.0 // indirect
 	github.com/metacubex/sing-quic v0.0.0-20240518034124-7696d3f7da72 // indirect
 	github.com/metacubex/sing-shadowsocks v0.2.6 // indirect
 	github.com/metacubex/sing-shadowsocks2 v0.2.0 // indirect
-	github.com/metacubex/sing-tun v0.2.7-0.20240512075008-89e7c6208eec // indirect
+	github.com/metacubex/sing-tun v0.2.7-0.20240627012306-9d1f5fc0b45e // indirect
 	github.com/metacubex/sing-vmess v0.1.9-0.20231207122118-72303677451f // indirect
-	github.com/metacubex/sing-wireguard v0.0.0-20240321042214-224f96122a63 // indirect
+	github.com/metacubex/sing-wireguard v0.0.0-20240618022557-a6efaa37127a // indirect
 	github.com/metacubex/tfo-go v0.0.0-20240228025757-be1269474a66 // indirect
 	github.com/metacubex/utls v1.6.6 // indirect
 	github.com/mroth/weightedrand/v2 v2.1.0 // indirect
@@ -71,18 +72,19 @@ require (
 	github.com/oschwald/maxminddb-golang v1.12.0 // indirect
 	github.com/pierrec/lz4/v4 v4.1.14 // indirect
 	github.com/power-devops/perfstat v0.0.0-20210106213030-5aafc221ea8c // indirect
-	github.com/puzpuzpuz/xsync/v3 v3.1.0 // indirect
+	github.com/puzpuzpuz/xsync/v3 v3.2.0 // indirect
 	github.com/quic-go/qpack v0.4.0 // indirect
 	github.com/quic-go/qtls-go1-20 v0.4.1 // indirect
 	github.com/sagernet/bbolt v0.0.0-20231014093535-ea5cb2fe9f0a // indirect
-	github.com/sagernet/netlink v0.0.0-20220905062125-8043b4a9aa97 // indirect
+	github.com/sagernet/netlink v0.0.0-20240612041022-b9a21c07ac6a // indirect
-	github.com/sagernet/sing v0.3.8 // indirect
+	github.com/sagernet/nftables v0.3.0-beta.4 // indirect
+	github.com/sagernet/sing v0.5.0-alpha.10 // indirect
 	github.com/sagernet/sing-mux v0.2.1-0.20240124034317-9bfb33698bb6 // indirect
 	github.com/sagernet/sing-shadowtls v0.1.4 // indirect
 	github.com/sagernet/smux v0.0.0-20231208180855-7041f6ea79e7 // indirect
 	github.com/sagernet/wireguard-go v0.0.0-20231209092712-9a439356a62e // indirect
 	github.com/samber/lo v1.39.0 // indirect
-	github.com/shirou/gopsutil/v3 v3.24.4 // indirect
+	github.com/shirou/gopsutil/v3 v3.24.5 // indirect
 	github.com/shoenig/go-m1cpu v0.1.6 // indirect
 	github.com/sina-ghaderi/poly1305 v0.0.0-20220724002748-c5926b03988b // indirect
 	github.com/sina-ghaderi/rabaead v0.0.0-20220730151906-ab6e06b96e8c // indirect
@@ -91,21 +93,20 @@ require (
 	github.com/tklauser/go-sysconf v0.3.12 // indirect
 	github.com/tklauser/numcpus v0.6.1 // indirect
 	github.com/u-root/uio v0.0.0-20230220225925-ffce2a382923 // indirect
-	github.com/vishvananda/netns v0.0.0-20211101163701-50045581ed74 // indirect
+	github.com/vishvananda/netns v0.0.4 // indirect
 	github.com/wk8/go-ordered-map/v2 v2.1.8 // indirect
 	github.com/yusufpapurcu/wmi v1.2.4 // indirect
-	github.com/zhangyunhao116/fastrand v0.4.0 // indirect
 	gitlab.com/yawning/bsaes.git v0.0.0-20190805113838-0a714cd429ec // indirect
 	go.uber.org/mock v0.4.0 // indirect
 	go4.org/netipx v0.0.0-20231129151722-fdeea329fbba // indirect
-	golang.org/x/crypto v0.23.0 // indirect
+	golang.org/x/crypto v0.24.0 // indirect
-	golang.org/x/exp v0.0.0-20240506185415-9bf2ced13842 // indirect
+	golang.org/x/exp v0.0.0-20240613232115-7f521ea00fb8 // indirect
-	golang.org/x/mod v0.17.0 // indirect
+	golang.org/x/mod v0.18.0 // indirect
-	golang.org/x/sys v0.20.0 // indirect
+	golang.org/x/sys v0.21.0 // indirect
-	golang.org/x/text v0.15.0 // indirect
+	golang.org/x/text v0.16.0 // indirect
 	golang.org/x/time v0.5.0 // indirect
-	golang.org/x/tools v0.21.0 // indirect
+	golang.org/x/tools v0.22.0 // indirect
-	google.golang.org/protobuf v1.34.1 // indirect
+	google.golang.org/protobuf v1.34.2 // indirect
 	gopkg.in/yaml.v3 v3.0.1 // indirect
 	lukechampine.com/blake3 v1.3.0 // indirect
 )

core/go.sum

@@ -48,8 +48,8 @@ github.com/fsnotify/fsnotify v1.7.0 h1:8JEhPFa5W2WU7YfeZzPNqzMP6Lwt7L2715Ggo0nos
 github.com/fsnotify/fsnotify v1.7.0/go.mod h1:40Bi/Hjc2AVfZrqy+aj+yEI+/bRxZnMJyTJwOpGvigM=
 github.com/gaukas/godicttls v0.0.4 h1:NlRaXb3J6hAnTmWdsEKb9bcSBD6BvcIjdGdeb0zfXbk=
 github.com/gaukas/godicttls v0.0.4/go.mod h1:l6EenT4TLWgTdwslVb4sEMOCf7Bv0JAK67deKr9/NCI=
-github.com/go-chi/chi/v5 v5.0.12 h1:9euLV5sTrTNTRUU9POmDUvfxyj6LAABLUcEWO+JJb4s=
+github.com/go-chi/chi/v5 v5.0.14 h1:PyEwo2Vudraa0x/Wl6eDRRW2NXBvekgfxyydcM0WGE0=
-github.com/go-chi/chi/v5 v5.0.12/go.mod h1:DslCQbL2OYiznFReuXYUmQ2hGd1aDpCnlMNITLSKoi8=
+github.com/go-chi/chi/v5 v5.0.14/go.mod h1:DslCQbL2OYiznFReuXYUmQ2hGd1aDpCnlMNITLSKoi8=
 github.com/go-chi/cors v1.2.1 h1:xEC8UT3Rlp2QuWNEr4Fs/c2EAGVKBwy/1vHx3bppil4=
 github.com/go-chi/cors v1.2.1/go.mod h1:sSbTewc+6wYHBBCW7ytsFSn836hqM7JxpglAy2Vzc58=
 github.com/go-chi/render v1.0.3 h1:AsXqd2a1/INaIfUSKq3G5uA8weYx20FOsM7uSoCyyt4=
@@ -75,7 +75,6 @@ github.com/golang/protobuf v1.5.3/go.mod h1:XVQd3VNwM+JqD3oG2Ue2ip4fOMUkwXdXDdiu
 github.com/google/btree v1.1.2 h1:xf4v41cLI2Z6FxbKm+8Bu+m8ifhj15JuZ9sa0jZCMUU=
 github.com/google/btree v1.1.2/go.mod h1:qOPhT0dTNdNzV6Z/lhRX0YXUafgPLFUh+gZMl761Gm4=
 github.com/google/go-cmp v0.5.6/go.mod h1:v8dTdLbMG2kIc/vJvl+f65V22dbkXbowE6jgT/gNBxE=
-github.com/google/go-cmp v0.5.9/go.mod h1:17dUlkBOakJ0+DkrSSNjCkIjxS6bF9zb3elmeNGIjoY=
 github.com/google/go-cmp v0.6.0 h1:ofyhxvXcZhMsU5ulbFiLKl/XBFqE1GSq7atu8tAmTRI=
 github.com/google/go-cmp v0.6.0/go.mod h1:17dUlkBOakJ0+DkrSSNjCkIjxS6bF9zb3elmeNGIjoY=
 github.com/google/pprof v0.0.0-20210407192527-94a9f03dee38 h1:yAJXTCF9TqKcTiHJAE8dj7HMvPfh66eeA2JYW7eFpSE=
@@ -85,16 +84,16 @@ github.com/google/tink/go v1.6.1/go.mod h1:IGW53kTgag+st5yPhKKwJ6u2l+SSp5/v9XF7s
 github.com/hashicorp/yamux v0.1.1 h1:yrQxtgseBDrq9Y652vSRDvsKCJKOUD+GzTS4Y0Y8pvE=
 github.com/hashicorp/yamux v0.1.1/go.mod h1:CtWFDAQgb7dxtzFs4tWbplKIe2jSi3+5vKbgIO0SLnQ=
 github.com/ianlancetaylor/demangle v0.0.0-20200824232613-28f6c0f3b639/go.mod h1:aSSvb/t6k1mPoxDqO4vJh6VOCGPwU4O0C2/Eqndh1Sc=
-github.com/insomniacslk/dhcp v0.0.0-20240419123447-f1cffa2c0c49 h1:/OuvSMGT9+xnyZ+7MZQ1zdngaCCAdPoSw8B/uurZ7pg=
+github.com/insomniacslk/dhcp v0.0.0-20240529192340-51bc6136a0a6 h1:dh8D8FksyMhD64mRMbUhZHWYJfNoNMCxfVq6eexleMw=
-github.com/insomniacslk/dhcp v0.0.0-20240419123447-f1cffa2c0c49/go.mod h1:KclMyHxX06VrVr0DJmeFSUb1ankt7xTfoOA35pCkoic=
+github.com/insomniacslk/dhcp v0.0.0-20240529192340-51bc6136a0a6/go.mod h1:KclMyHxX06VrVr0DJmeFSUb1ankt7xTfoOA35pCkoic=
 github.com/josharian/intern v1.0.0/go.mod h1:5DoeVV0s6jJacbCEi61lwdGj/aVlrQvzHFFd8Hwg//Y=
 github.com/josharian/native v1.0.1-0.20221213033349-c1e37c09b531/go.mod h1:7X/raswPFr05uY3HiLlYeyQntB6OO7E/d2Cu7qoaN2w=
 github.com/josharian/native v1.1.0 h1:uuaP0hAbW7Y4l0ZRQ6C9zfb7Mg1mbFKry/xzDAfmtLA=
 github.com/josharian/native v1.1.0/go.mod h1:7X/raswPFr05uY3HiLlYeyQntB6OO7E/d2Cu7qoaN2w=
 github.com/klauspost/compress v1.17.4 h1:Ej5ixsIri7BrIjBkRZLTo6ghwrEtHFk7ijlczPW4fZ4=
 github.com/klauspost/compress v1.17.4/go.mod h1:/dCuZOvVtNoHsyb+cuJD3itjs3NbnF6KH9zAO4BDxPM=
-github.com/klauspost/cpuid/v2 v2.2.7 h1:ZWSB3igEs+d0qvnxR/ZBzXVmxkgt8DdzP6m9pfuVLDM=
+github.com/klauspost/cpuid/v2 v2.2.8 h1:+StwCXwm9PdpiEkPyzBXIy+M9KUb4ODm0Zarf1kS5BM=
-github.com/klauspost/cpuid/v2 v2.2.7/go.mod h1:Lcz8mBdAVJIBVzewtcLocK12l3Y+JytZYpaMropDUws=
+github.com/klauspost/cpuid/v2 v2.2.8/go.mod h1:Lcz8mBdAVJIBVzewtcLocK12l3Y+JytZYpaMropDUws=
 github.com/kr/pretty v0.3.1 h1:flRD4NNwYAUpkphVc1HcthR4KEIFJ65n8Mw5qdRn3LE=
 github.com/kr/pretty v0.3.1/go.mod h1:hoEshYVHaxMs3cyo3Yncou5ZscifuDolrwPKZanG3xk=
 github.com/kr/text v0.2.0 h1:5Nx0Ya0ZqY2ygV366QzturHI13Jq95ApcVaJBhpS+AY=
@@ -113,26 +112,28 @@ github.com/metacubex/gopacket v1.1.20-0.20230608035415-7e2f98a3e759 h1:cjd4biTvO
 github.com/metacubex/gopacket v1.1.20-0.20230608035415-7e2f98a3e759/go.mod h1:UHOv2xu+RIgLwpXca7TLrXleEd4oR3sPatW6IF8wU88=
 github.com/metacubex/gvisor v0.0.0-20240320004321-933faba989ec h1:HxreOiFTUrJXJautEo8rnE1uKTVGY8wtZepY1Tii/Nc=
 github.com/metacubex/gvisor v0.0.0-20240320004321-933faba989ec/go.mod h1:8BVmQ+3cxjqzWElafm24rb2Ae4jRI6vAXNXWqWjfrXw=
-github.com/metacubex/quic-go v0.43.2-0.20240518033621-2c3d14c6b38e h1:Nzwe08FNIJpExWpy9iXkG336dN/8nJqn69yijB7vJ8g=
+github.com/metacubex/quic-go v0.45.1-0.20240610004319-163fee60637e h1:bLYn3GuRvWDcBDAkIv5kUYIhzHwafDVq635BuybnKqI=
-github.com/metacubex/quic-go v0.43.2-0.20240518033621-2c3d14c6b38e/go.mod h1:uXHODgJFUfUnkkCMWLd5Er6L5QY/LFRZb9LD5jyyhsk=
+github.com/metacubex/quic-go v0.45.1-0.20240610004319-163fee60637e/go.mod h1:Yza2H7Ax1rxWPUcJx0vW+oAt9EsPuSiyQFhFabUPzwU=
+github.com/metacubex/randv2 v0.2.0 h1:uP38uBvV2SxYfLj53kuvAjbND4RUDfFJjwr4UigMiLs=
+github.com/metacubex/randv2 v0.2.0/go.mod h1:kFi2SzrQ5WuneuoLLCMkABtiBu6VRrMrWFqSPyj2cxY=
 github.com/metacubex/sing-quic v0.0.0-20240518034124-7696d3f7da72 h1:Wr4g1HCb5Z/QIFwFiVNjO2qL+dRu25+Mdn9xtAZZ+ew=
 github.com/metacubex/sing-quic v0.0.0-20240518034124-7696d3f7da72/go.mod h1:g7Mxj7b7zm7YVqD975mk/hSmrb0A0G4bVvIMr2MMzn8=
 github.com/metacubex/sing-shadowsocks v0.2.6 h1:6oEB3QcsFYnNiFeoevcXrCwJ3sAablwVSgtE9R3QeFQ=
 github.com/metacubex/sing-shadowsocks v0.2.6/go.mod h1:zIkMeSnb8Mbf4hdqhw0pjzkn1d99YJ3JQm/VBg5WMTg=
 github.com/metacubex/sing-shadowsocks2 v0.2.0 h1:hqwT/AfI5d5UdPefIzR6onGHJfDXs5zgOM5QSgaM/9A=
 github.com/metacubex/sing-shadowsocks2 v0.2.0/go.mod h1:LCKF6j1P94zN8ZS+LXRK1gmYTVGB3squivBSXAFnOg8=
-github.com/metacubex/sing-tun v0.2.7-0.20240512075008-89e7c6208eec h1:K4Wq3GOdLZ/xcqwyzAt4kmYQrjokyKQ3u/Xh5Yft14U=
+github.com/metacubex/sing-tun v0.2.7-0.20240627012306-9d1f5fc0b45e h1:o+zohxPRo45P35fS9u1zfdBgr+L/7S0ObGU6YjbVBIc=
-github.com/metacubex/sing-tun v0.2.7-0.20240512075008-89e7c6208eec/go.mod h1:4VsMwZH1IlgPGFK1ZbBomZ/B2MYkTgs2+gnBAr5GOIo=
+github.com/metacubex/sing-tun v0.2.7-0.20240627012306-9d1f5fc0b45e/go.mod h1:WwJGbCx7bQcBzuQXiDOJvZH27R0kIjKNNlISIWsL6kM=
 github.com/metacubex/sing-vmess v0.1.9-0.20231207122118-72303677451f h1:QjXrHKbTMBip/C+R79bvbfr42xH1gZl3uFb0RELdZiQ=
 github.com/metacubex/sing-vmess v0.1.9-0.20231207122118-72303677451f/go.mod h1:olVkD4FChQ5gKMHG4ZzuD7+fMkJY1G8vwOKpRehjrmY=
-github.com/metacubex/sing-wireguard v0.0.0-20240321042214-224f96122a63 h1:AGyIB55UfQm/0ZH0HtQO9u3l//yjtHUpjeRjjPGfGRI=
+github.com/metacubex/sing-wireguard v0.0.0-20240618022557-a6efaa37127a h1:NpSGclHJUYndUwBmyIpFBSoBVg8PoVX7QQKhYg0DjM0=
-github.com/metacubex/sing-wireguard v0.0.0-20240321042214-224f96122a63/go.mod h1:uY+BYb0UEknLrqvbGcwi9i++KgrKxsurysgI6G1Pveo=
+github.com/metacubex/sing-wireguard v0.0.0-20240618022557-a6efaa37127a/go.mod h1:uY+BYb0UEknLrqvbGcwi9i++KgrKxsurysgI6G1Pveo=
 github.com/metacubex/tfo-go v0.0.0-20240228025757-be1269474a66 h1:as/aO/fM8nv4W4pOr9EETP6kV/Oaujk3fUNyQSJK61c=
 github.com/metacubex/tfo-go v0.0.0-20240228025757-be1269474a66/go.mod h1:c7bVFM9f5+VzeZ/6Kg77T/jrg1Xp8QpqlSHvG/aXVts=
 github.com/metacubex/utls v1.6.6 h1:3D12YKHTf2Z41UPhQU2dWerNWJ5TVQD9gKoQ+H+iLC8=
 github.com/metacubex/utls v1.6.6/go.mod h1:+WLFUnXjcpdxXCnyX25nggw8C6YonZ8zOK2Zm/oRvdo=
-github.com/miekg/dns v1.1.59 h1:C9EXc/UToRwKLhK5wKU/I4QVsBUc8kE6MkHBkeypWZs=
+github.com/miekg/dns v1.1.61 h1:nLxbwF3XxhwVSm8g9Dghm9MHPaUZuqhPiGL+675ZmEs=
-github.com/miekg/dns v1.1.59/go.mod h1:nZpewl5p6IvctfgrckopVx2OlSEHPRO/U4SYkRklrEk=
+github.com/miekg/dns v1.1.61/go.mod h1:mnAarhS3nWaW+NVP2wTkYVIZyHNJ098SJZUki3eykwQ=
 github.com/mroth/weightedrand/v2 v2.1.0 h1:o1ascnB1CIVzsqlfArQQjeMy1U0NcIbBO5rfd5E/OeU=
 github.com/mroth/weightedrand/v2 v2.1.0/go.mod h1:f2faGsfOGOwc1p94wzHKKZyTpcJUW7OJ/9U4yfiNAOU=
 github.com/oasisprotocol/deoxysii v0.0.0-20220228165953-2091330c22b7 h1:1102pQc2SEPp5+xrS26wEaeb26sZy6k9/ZXlZN+eXE4=
@@ -155,8 +156,8 @@ github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZb
 github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
 github.com/power-devops/perfstat v0.0.0-20210106213030-5aafc221ea8c h1:ncq/mPwQF4JjgDlrVEn3C11VoGHZN7m8qihwgMEtzYw=
 github.com/power-devops/perfstat v0.0.0-20210106213030-5aafc221ea8c/go.mod h1:OmDBASR4679mdNQnz2pUhc2G8CO2JrUAVFDRBDP/hJE=
-github.com/puzpuzpuz/xsync/v3 v3.1.0 h1:EewKT7/LNac5SLiEblJeUu8z5eERHrmRLnMQL2d7qX4=
+github.com/puzpuzpuz/xsync/v3 v3.2.0 h1:9AzuUeF88YC5bK8u2vEG1Fpvu4wgpM1wfPIExfaaDxQ=
-github.com/puzpuzpuz/xsync/v3 v3.1.0/go.mod h1:VjzYrABPabuM4KyBh1Ftq6u8nhwY5tBPKP9jpmh0nnA=
+github.com/puzpuzpuz/xsync/v3 v3.2.0/go.mod h1:VjzYrABPabuM4KyBh1Ftq6u8nhwY5tBPKP9jpmh0nnA=
 github.com/quic-go/qpack v0.4.0 h1:Cr9BXA1sQS2SmDUWjSofMPNKmvF6IiIfDRmgU0w1ZCo=
 github.com/quic-go/qpack v0.4.0/go.mod h1:UZVnYIfi5GRk+zI9UMaCPsmZ2xKJP7XBUvVyT1Knj9A=
 github.com/quic-go/qtls-go1-20 v0.4.1 h1:D33340mCNDAIKBqXuAvexTNMUByrYmFYVfKfDN5nfFs=
@@ -165,11 +166,13 @@ github.com/rogpeppe/go-internal v1.9.0 h1:73kH8U+JUqXU8lRuOHeVHaa/SZPifC7BkcraZV
 github.com/rogpeppe/go-internal v1.9.0/go.mod h1:WtVeX8xhTBvf0smdhujwtBcq4Qrzq/fJaraNFVN+nFs=
 github.com/sagernet/bbolt v0.0.0-20231014093535-ea5cb2fe9f0a h1:+NkI2670SQpQWvkkD2QgdTuzQG263YZ+2emfpeyGqW0=
 github.com/sagernet/bbolt v0.0.0-20231014093535-ea5cb2fe9f0a/go.mod h1:63s7jpZqcDAIpj8oI/1v4Izok+npJOHACFCU6+huCkM=
-github.com/sagernet/netlink v0.0.0-20220905062125-8043b4a9aa97 h1:iL5gZI3uFp0X6EslacyapiRz7LLSJyr4RajF/BhMVyE=
+github.com/sagernet/netlink v0.0.0-20240612041022-b9a21c07ac6a h1:ObwtHN2VpqE0ZNjr6sGeT00J8uU7JF4cNUdb44/Duis=
-github.com/sagernet/netlink v0.0.0-20220905062125-8043b4a9aa97/go.mod h1:xLnfdiJbSp8rNqYEdIW/6eDO4mVoogml14Bh2hSiFpM=
+github.com/sagernet/netlink v0.0.0-20240612041022-b9a21c07ac6a/go.mod h1:xLnfdiJbSp8rNqYEdIW/6eDO4mVoogml14Bh2hSiFpM=
+github.com/sagernet/nftables v0.3.0-beta.4 h1:kbULlAwAC3jvdGAC1P5Fa3GSxVwQJibNenDW2zaXr8I=
+github.com/sagernet/nftables v0.3.0-beta.4/go.mod h1:OQXAjvjNGGFxaTgVCSTRIhYB5/llyVDeapVoENYBDS8=
 github.com/sagernet/sing v0.2.18/go.mod h1:OL6k2F0vHmEzXz2KW19qQzu172FDgSbUSODylighuVo=
-github.com/sagernet/sing v0.3.8 h1:gm4JKalPhydMYX2zFOTnnd4TXtM/16WFRqSjMepYQQk=
+github.com/sagernet/sing v0.5.0-alpha.10 h1:kuHl10gpjbKQAdQfyogQU3u0CVnpqC3wrAHe/+BFaXc=
-github.com/sagernet/sing v0.3.8/go.mod h1:+60H3Cm91RnL9dpVGWDPHt0zTQImO9Vfqt9a4rSambI=
+github.com/sagernet/sing v0.5.0-alpha.10/go.mod h1:ARkL0gM13/Iv5VCZmci/NuoOlePoIsW0m7BWfln/Hak=
 github.com/sagernet/sing-mux v0.2.1-0.20240124034317-9bfb33698bb6 h1:5bCAkvDDzSMITiHFjolBwpdqYsvycdTu71FsMEFXQ14=
 github.com/sagernet/sing-mux v0.2.1-0.20240124034317-9bfb33698bb6/go.mod h1:khzr9AOPocLa+g53dBplwNDz4gdsyx/YM3swtAhlkHQ=
 github.com/sagernet/sing-shadowtls v0.1.4 h1:aTgBSJEgnumzFenPvc+kbD9/W0PywzWevnVpEx6Tw3k=
@@ -180,8 +183,8 @@ github.com/sagernet/wireguard-go v0.0.0-20231209092712-9a439356a62e h1:iGH0RMv2F
 github.com/sagernet/wireguard-go v0.0.0-20231209092712-9a439356a62e/go.mod h1:YbL4TKHRR6APYQv3U2RGfwLDpPYSyWz6oUlpISBEzBE=
 github.com/samber/lo v1.39.0 h1:4gTz1wUhNYLhFSKl6O+8peW0v2F4BCY034GRpU9WnuA=
 github.com/samber/lo v1.39.0/go.mod h1:+m/ZKRl6ClXCE2Lgf3MsQlWfh4bn1bz6CXEOxnEXnEA=
-github.com/shirou/gopsutil/v3 v3.24.4 h1:dEHgzZXt4LMNm+oYELpzl9YCqV65Yr/6SfrvgRBtXeU=
+github.com/shirou/gopsutil/v3 v3.24.5 h1:i0t8kL+kQTvpAYToeuiVk3TgDeKOFioZO3Ztz/iZ9pI=
-github.com/shirou/gopsutil/v3 v3.24.4/go.mod h1:lTd2mdiOspcqLgAnr9/nGi71NkeMpWKdmhuxm9GusH8=
+github.com/shirou/gopsutil/v3 v3.24.5/go.mod h1:bsoOS1aStSs9ErQ1WWfxllSeS1K5D+U30r2NfcubMVk=
 github.com/shoenig/go-m1cpu v0.1.6 h1:nxdKQNcEB6vzgA2E2bvzKIYRuNj7XNJ4S/aRSwKzFtM=
 github.com/shoenig/go-m1cpu v0.1.6/go.mod h1:1JJMcUBvfNwpq05QDQVAnx3gUHr9IYF7GNg9SUEw2VQ=
 github.com/shoenig/test v0.6.4 h1:kVTaSd7WLz5WZ2IaoM0RSzRsUD+m8wRR+5qvntpn4LU=
@@ -195,15 +198,9 @@ github.com/sina-ghaderi/rabbitio v0.0.0-20220730151941-9ce26f4f872e/go.mod h1:+e
 github.com/sirupsen/logrus v1.9.3 h1:dueUQJ1C2q9oE3F7wvmSGAaVtTmUizReu6fjN8uqzbQ=
 github.com/sirupsen/logrus v1.9.3/go.mod h1:naHLuLoDiP4jHNo9R0sCBMtWGeIprob74mVsIT4qYEQ=
 github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
-github.com/stretchr/objx v0.4.0/go.mod h1:YvHI0jy2hoMjB+UWwv71VJQ9isScKT/TqJzVSSt89Yw=
-github.com/stretchr/objx v0.5.0/go.mod h1:Yh+to48EsGEfYuaHDzXPcE3xhTkx73EhmCGUpEOglKo=
-github.com/stretchr/objx v0.5.2/go.mod h1:FRsXN1f5AsAjCGJKqEizvkpNtU+EGNCLh3NxZ/8L+MA=
 github.com/stretchr/testify v1.3.0/go.mod h1:M5WIy9Dh21IEIfnGCwXGc5bZfKNJtfHm1UVUgZn+9EI=
 github.com/stretchr/testify v1.6.1/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
 github.com/stretchr/testify v1.7.0/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
-github.com/stretchr/testify v1.7.1/go.mod h1:6Fq8oRcR53rry900zMqJjRRixrwX3KX962/h/Wwjteg=
-github.com/stretchr/testify v1.8.0/go.mod h1:yNjHg4UonilssWZ8iaSj1OCr/vHnekPRkoO+kdMU+MU=
-github.com/stretchr/testify v1.8.4/go.mod h1:sz/lmYIOXD/1dqDmKjjqLyZ2RngseejIcXlSw2iwfAo=
 github.com/stretchr/testify v1.9.0 h1:HtqpIVDClZ4nwg75+f6Lvsy/wHu+3BoSGCbBAcpTsTg=
 github.com/stretchr/testify v1.9.0/go.mod h1:r2ic/lqez/lEtzL7wO/rwa5dbSLXVDPFyf8C91i36aY=
 github.com/tklauser/go-sysconf v0.3.12 h1:0QaGUFOdQaIVdPgfITYzaTegZvdCjmYO52cSFAEVmqU=
@@ -215,14 +212,12 @@ github.com/u-root/uio v0.0.0-20230220225925-ffce2a382923/go.mod h1:eLL9Nub3yfAho
 github.com/vishvananda/netlink v1.1.0/go.mod h1:cTgwzPIzzgDAYoQrMm0EdrjRUBkTqKYppBueQtXaqoE=
 github.com/vishvananda/netns v0.0.0-20191106174202-0a2b9b5464df/go.mod h1:JP3t17pCcGlemwknint6hfoeCVQrEMVwxRLRjXpq+BU=
 github.com/vishvananda/netns v0.0.0-20210104183010-2eb08e3e575f/go.mod h1:DD4vA1DwXk04H54A1oHXtwZmA0grkVMdPxx/VGLCah0=
-github.com/vishvananda/netns v0.0.0-20211101163701-50045581ed74 h1:gga7acRE695APm9hlsSMoOoE65U4/TcqNj90mc69Rlg=
+github.com/vishvananda/netns v0.0.4 h1:Oeaw1EM2JMxD51g9uhtC0D7erkIjgmj8+JZc26m1YX8=
-github.com/vishvananda/netns v0.0.0-20211101163701-50045581ed74/go.mod h1:DD4vA1DwXk04H54A1oHXtwZmA0grkVMdPxx/VGLCah0=
+github.com/vishvananda/netns v0.0.4/go.mod h1:SpkAiCQRtJ6TvvxPnOSyH3BMl6unz3xZlaprSwhNNJM=
 github.com/wk8/go-ordered-map/v2 v2.1.8 h1:5h/BUHu93oj4gIdvHHHGsScSTMijfx5PeYkE/fJgbpc=
 github.com/wk8/go-ordered-map/v2 v2.1.8/go.mod h1:5nJHM5DyteebpVlHnWMV0rPz6Zp7+xBAnxjb1X5vnTw=
 github.com/yusufpapurcu/wmi v1.2.4 h1:zFUKzehAFReQwLys1b/iSMl+JQGSCSjtVqQn9bBrPo0=
 github.com/yusufpapurcu/wmi v1.2.4/go.mod h1:SBZ9tNy3G9/m5Oi98Zks0QjeHVDvuK0qfxQmPyzfmi0=
-github.com/zhangyunhao116/fastrand v0.4.0 h1:86QB6Y+GGgLZRFRDCjMmAS28QULwspK9sgL5d1Bx3H4=
-github.com/zhangyunhao116/fastrand v0.4.0/go.mod h1:vIyo6EyBhjGKpZv6qVlkPl4JVAklpMM4DSKzbAkMguA=
 gitlab.com/yawning/bsaes.git v0.0.0-20190805113838-0a714cd429ec h1:FpfFs4EhNehiVfzQttTuxanPIT43FtkkCFypIod8LHo=
 gitlab.com/yawning/bsaes.git v0.0.0-20190805113838-0a714cd429ec/go.mod h1:BZ1RAoRPbCxum9Grlv5aeksu2H8BiKehBYooU2LFiOQ=
 go.uber.org/mock v0.4.0 h1:VcM4ZOtdbR4f6VXfiOpwpVJDL6lCReaZ6mw31wqh7KU=
@@ -231,18 +226,18 @@ go4.org/netipx v0.0.0-20231129151722-fdeea329fbba h1:0b9z3AuHCjxk0x/opv64kcgZLBs
 go4.org/netipx v0.0.0-20231129151722-fdeea329fbba/go.mod h1:PLyyIXexvUFg3Owu6p/WfdlivPbZJsZdgWZlrGope/Y=
 golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w=
 golang.org/x/crypto v0.0.0-20191011191535-87dc89f01550/go.mod h1:yigFU9vqHzYiE8UmvKecakEJjdnWj3jj499lnFckfCI=
-golang.org/x/crypto v0.23.0 h1:dIJU/v2J8Mdglj/8rJ6UUOM3Zc9zLZxVZwwxMooUSAI=
+golang.org/x/crypto v0.24.0 h1:mnl8DM0o513X8fdIkmyFE/5hTYxbwYOjDS/+rK6qpRI=
-golang.org/x/crypto v0.23.0/go.mod h1:CKFgDieR+mRhux2Lsu27y0fO304Db0wZe70UKqHu0v8=
+golang.org/x/crypto v0.24.0/go.mod h1:Z1PMYSOR5nyMcyAVAIQSKCDwalqy85Aqn1x3Ws4L5DM=
-golang.org/x/exp v0.0.0-20240506185415-9bf2ced13842 h1:vr/HnozRka3pE4EsMEg1lgkXJkTFJCVUX+S/ZT6wYzM=
+golang.org/x/exp v0.0.0-20240613232115-7f521ea00fb8 h1:yixxcjnhBmY0nkL253HFVIm0JsFHwrHdT3Yh6szTnfY=
-golang.org/x/exp v0.0.0-20240506185415-9bf2ced13842/go.mod h1:XtvwrStGgqGPLc4cjQfWqZHG1YFdYs6swckp8vpsjnc=
+golang.org/x/exp v0.0.0-20240613232115-7f521ea00fb8/go.mod h1:jj3sYF3dwk5D+ghuXyeI3r5MFf+NT2An6/9dOA95KSI=
 golang.org/x/lint v0.0.0-20200302205851-738671d3881b/go.mod h1:3xt1FjdF8hUf6vQPIChWIBhFzV8gjjsPE/fR3IyQdNY=
 golang.org/x/mod v0.1.1-0.20191105210325-c90efee705ee/go.mod h1:QqPTAvyqsEbceGzBzNggFXnrqF1CaUcvgkdR5Ot7KZg=
-golang.org/x/mod v0.17.0 h1:zY54UmvipHiNd+pm+m0x9KhZ9hl1/7QNMyxXbc6ICqA=
+golang.org/x/mod v0.18.0 h1:5+9lSbEzPSdWkH32vYPBwEpX8KwDbM52Ud9xBUvNlb0=
-golang.org/x/mod v0.17.0/go.mod h1:hTbmBsO62+eylJbnUtE2MGJUyE7QWk4xUqPFrRgJ+7c=
+golang.org/x/mod v0.18.0/go.mod h1:hTbmBsO62+eylJbnUtE2MGJUyE7QWk4xUqPFrRgJ+7c=
 golang.org/x/net v0.0.0-20190404232315-eb5bcb51f2a3/go.mod h1:t9HGtf8HONx5eT2rtn7q6eTqICYqUVnKs3thJo3Qplg=
 golang.org/x/net v0.0.0-20190620200207-3b0461eec859/go.mod h1:z5CRVTTTmAJ677TzLLGU+0bjPO0LkuOLi4/5GtJWs/s=
-golang.org/x/net v0.25.0 h1:d/OCCoBEUq33pjydKrGQhw7IlUPI2Oylr+8qLx49kac=
+golang.org/x/net v0.26.0 h1:soB7SVo0PWrY4vPW/+ay0jKDNScG2X9wFeYlXIvJsOQ=
-golang.org/x/net v0.25.0/go.mod h1:JkAGAh7GEvH74S6FOH42FLoXpXbE/aqXSrIQjXgsiwM=
+golang.org/x/net v0.26.0/go.mod h1:5YKkiSynbBIh3p6iOc/vibscux0x38BZDkn8sCUPxHE=
 golang.org/x/sync v0.0.0-20190423024810-112230192c58/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sync v0.7.0 h1:YsImfSBoP9QPYL0xyKJPq0gcaJdG3rInoqxTWbfQu9M=
 golang.org/x/sync v0.7.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
@@ -262,26 +257,24 @@ golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.8.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.11.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.14.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
-golang.org/x/sys v0.19.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/sys v0.21.0 h1:rF+pYz3DAGSQAxAu1CbC7catZg4ebC4UIeIhKxBZvws=
-golang.org/x/sys v0.20.0 h1:Od9JTbYCk261bKm4M/mw7AklTlFYIa0bIp9BgSm1S8Y=
+golang.org/x/sys v0.21.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
-golang.org/x/sys v0.20.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/term v0.21.0 h1:WVXCp+/EBEHOj53Rvu+7KiT/iElMrO8ACK16SMZ3jaA=
-golang.org/x/term v0.20.0 h1:VnkxpohqXaOBYJtBmEppKUG6mXpi+4O6purfc2+sMhw=
+golang.org/x/term v0.21.0/go.mod h1:ooXLefLobQVslOqselCNF4SxFAaoS6KujMbsGzSDmX0=
-golang.org/x/term v0.20.0/go.mod h1:8UkIAJTvZgivsXaD6/pH6U9ecQzZ45awqEOzuCvwpFY=
 golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
-golang.org/x/text v0.15.0 h1:h1V/4gjBv8v9cjcR6+AR5+/cIYK5N/WAgiv4xlsEtAk=
+golang.org/x/text v0.16.0 h1:a94ExnEXNtEwYLGJSIUxnWoxoRz/ZcCsV63ROupILh4=
-golang.org/x/text v0.15.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
+golang.org/x/text v0.16.0/go.mod h1:GhwF1Be+LQoKShO3cGOHzqOgRrGaYc9AvblQOmPVHnI=
 golang.org/x/time v0.5.0 h1:o7cqy6amK/52YcAKIPlM3a+Fpj35zvRj2TP+e1xFSfk=
 golang.org/x/time v0.5.0/go.mod h1:3BpzKBy/shNhVucY/MWOyx10tF3SFh9QdLuxbVysPQM=
 golang.org/x/tools v0.0.0-20200130002326-2f3ba24bd6e7/go.mod h1:TB2adYChydJhpapKDTa4BR/hXlZSLoq2Wpct/0txZ28=
-golang.org/x/tools v0.21.0 h1:qc0xYgIbsSDt9EyWz05J5wfa7LOVW0YTLOXrqdLAWIw=
+golang.org/x/tools v0.22.0 h1:gqSGLZqv+AI9lIQzniJ0nZDRG5GBPsSi+DRNHWNz6yA=
-golang.org/x/tools v0.21.0/go.mod h1:aiJjzUbINMkxbQROHiO6hDPo2LHcIPhhQsa9DLh0yGk=
+golang.org/x/tools v0.22.0/go.mod h1:aCwcsjqvq7Yqt6TNyX7QMU2enbQ/Gt0bo6krSeEri+c=
 golang.org/x/xerrors v0.0.0-20191011141410-1b5146add898/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
 golang.org/x/xerrors v0.0.0-20191204190536-9bdfabe68543/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
-google.golang.org/protobuf v1.34.1 h1:9ddQBjfCyZPOHPUiPxpYESBLc+T8P3E+Vo4IbKZgFWg=
+google.golang.org/protobuf v1.34.2 h1:6xV6lTsCfpGD21XK49h7MhtcApnLqkfYgPcdHftf6hg=
-google.golang.org/protobuf v1.34.1/go.mod h1:c6P6GXX6sHbq/GpV6MGZEdwhWPcYBgnhAHhKbcUYpos=
+google.golang.org/protobuf v1.34.2/go.mod h1:qYOHts0dSfpeUzUFpOMr/WGzszTmLH+DiWniOlNbLDw=
+gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405 h1:yhCVgyC4o1eVCa2tZl7eS0r+SDo693bJlVdllGtEeKM=
 gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
-gopkg.in/check.v1 v1.0.0-20180628173108-788fd7840127 h1:qIbj1fsPNlZgppZ+VLlY7N33q108Sa+fhmuc+sWQYwY=
-gopkg.in/check.v1 v1.0.0-20180628173108-788fd7840127/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
 gopkg.in/yaml.v3 v3.0.0-20200313102051-9f266ea9e77c/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
 gopkg.in/yaml.v3 v3.0.1 h1:fxVm/GzAzEWqLHuvctI91KS9hhNmmWOoWu0XTYJS7CA=
 gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=

core/hub.go

@@ -13,6 +13,7 @@ import (
 	"github.com/metacubex/mihomo/adapter/provider"
 	"github.com/metacubex/mihomo/common/structure"
 	"github.com/metacubex/mihomo/common/utils"
+	"github.com/metacubex/mihomo/component/geodata"
 	"github.com/metacubex/mihomo/component/mmdb"
 	"github.com/metacubex/mihomo/config"
 	"github.com/metacubex/mihomo/constant"
@@ -35,6 +36,8 @@ var configParams = ConfigExtendedParams{}
 
 var isInit = false
 
+var currentProfileName = ""
+
 //export initClash
 func initClash(homeDirStr *C.char) bool {
 	if !isInit {
@@ -73,6 +76,16 @@ func forceGc() {
 	}()
 }
 
+//export setCurrentProfileName
+func setCurrentProfileName(s *C.char) {
+	currentProfileName = C.GoString(s)
+}
+
+//export getCurrentProfileName
+func getCurrentProfileName() *C.char {
+	return C.CString(currentProfileName)
+}
+
 //export validateConfig
 func validateConfig(s *C.char, port C.longlong) {
 	i := int64(port)
@@ -94,11 +107,11 @@ func updateConfig(s *C.char, port C.longlong) {
 	go func() {
 		var params = &GenerateConfigParams{}
 		err := json.Unmarshal([]byte(paramsString), params)
-		configParams = params.Params
 		if err != nil {
 			bridge.SendToPort(i, err.Error())
 			return
 		}
+		configParams = params.Params
 		prof := decorationConfig(params.ProfilePath, params.Config)
 		currentConfig = prof
 		applyConfig()
@@ -384,34 +397,44 @@ func updateExternalProvider(providerName *C.char, providerType *C.char, port C.l
 				bridge.SendToPort(i, err.Error())
 				return
 			}
-		case "GeoIp":
+		case "MMDB":
 			err := mmdb.DownloadMMDB(constant.Path.Resolve(providerNameString))
 			if err != nil {
 				bridge.SendToPort(i, err.Error())
 				return
 			}
-		case "GeoSite":
-			err := mmdb.DownloadGeoSite(constant.Path.Resolve(providerNameString))
-			if err != nil {
-				bridge.SendToPort(i, err.Error())
-				return
-			}
 		case "ASN":
 			err := mmdb.DownloadASN(constant.Path.Resolve(providerNameString))
 			if err != nil {
 				bridge.SendToPort(i, err.Error())
 				return
 			}
+		case "GeoIp":
+			err := geodata.DownloadGeoIP(constant.Path.Resolve(providerNameString))
+			if err != nil {
+				bridge.SendToPort(i, err.Error())
+				return
+			}
+		case "GeoSite":
+			err := geodata.DownloadGeoSite(constant.Path.Resolve(providerNameString))
+			if err != nil {
+				bridge.SendToPort(i, err.Error())
+				return
+			}
 		}
 		bridge.SendToPort(i, "")
 	}()
 }
 
 //export initNativeApiBridge
-func initNativeApiBridge(api unsafe.Pointer, port C.longlong) {
+func initNativeApiBridge(api unsafe.Pointer) {
 	bridge.InitDartApi(api)
+}
+
+//export initMessage
+func initMessage(port C.longlong) {
 	i := int64(port)
-	bridge.Port = &i
+	Port = i
 }
 
 //export freeCString
@@ -429,20 +452,20 @@ func init() {
 		} else {
 			delayData.Value = int32(delay)
 		}
-		bridge.SendMessage(bridge.Message{
+		SendMessage(Message{
-			Type: bridge.Delay,
+			Type: DelayMessage,
 			Data: delayData,
 		})
 	}
 	statistic.DefaultRequestNotify = func(c statistic.Tracker) {
-		bridge.SendMessage(bridge.Message{
+		SendMessage(Message{
-			Type: bridge.Request,
+			Type: RequestMessage,
 			Data: c,
 		})
 	}
 	executor.DefaultProxyProviderLoadedHook = func(providerName string) {
-		bridge.SendMessage(bridge.Message{
+		SendMessage(Message{
-			Type: bridge.Loaded,
+			Type: LoadedMessage,
 			Data: providerName,
 		})
 	}

core/log.go

@@ -2,7 +2,6 @@ package main
 
 import "C"
 import (
-	bridge "core/dart-bridge"
 	"github.com/metacubex/mihomo/common/observable"
 	"github.com/metacubex/mihomo/log"
 )
@@ -21,11 +20,11 @@ func startLog() {
 			if logData.LogLevel < log.Level() {
 				continue
 			}
-			message := &bridge.Message{
+			message := &Message{
-				Type: bridge.Log,
+				Type: LogMessage,
 				Data: logData,
 			}
-			bridge.SendMessage(*message)
+			SendMessage(*message)
 		}
 	}()
 }

core/message.go

@@ -0,0 +1,77 @@
+package main
+
+import (
+	bridge "core/dart-bridge"
+	"encoding/json"
+	"github.com/metacubex/mihomo/constant"
+)
+
+var Port int64
+var ServicePort int64
+
+type MessageType string
+
+const (
+	LogMessage     MessageType = "log"
+	ProtectMessage MessageType = "protect"
+	DelayMessage   MessageType = "delay"
+	ProcessMessage MessageType = "process"
+	RequestMessage MessageType = "request"
+	StartedMessage MessageType = "started"
+	LoadedMessage  MessageType = "loaded"
+)
+
+type Delay struct {
+	Name  string `json:"name"`
+	Value int32  `json:"value"`
+}
+
+type Process struct {
+	Id       int64              `json:"id"`
+	Metadata *constant.Metadata `json:"metadata"`
+}
+
+type Message struct {
+	Type MessageType `json:"type"`
+	Data interface{} `json:"data"`
+}
+
+func (message *Message) Json() (string, error) {
+	data, err := json.Marshal(message)
+	return string(data), err
+}
+
+func SendMessage(message Message) {
+	s, err := message.Json()
+	if err != nil {
+		return
+	}
+	if handler, ok := messageHandlers[message.Type]; ok {
+		handler(s)
+	} else {
+		sendToPort(s)
+	}
+}
+
+var messageHandlers = map[MessageType]func(string) bool{
+	ProtectMessage: sendToServicePort,
+	ProcessMessage: sendToServicePort,
+	StartedMessage: conditionalSend,
+	LoadedMessage:  conditionalSend,
+}
+
+func sendToPort(s string) bool {
+	return bridge.SendToPort(Port, s)
+}
+
+func sendToServicePort(s string) bool {
+	return bridge.SendToPort(ServicePort, s)
+}
+
+func conditionalSend(s string) bool {
+	isSuccess := sendToPort(s)
+	if !isSuccess {
+		return sendToServicePort(s)
+	}
+	return isSuccess
+}

core/process.go

@@ -4,7 +4,6 @@ package main
 
 import "C"
 import (
-	bridge "core/dart-bridge"
 	"encoding/json"
 	"errors"
 	"github.com/metacubex/mihomo/component/process"
@@ -43,8 +42,8 @@ func init() {
 
 		timeout := time.After(200 * time.Millisecond)
 
-		bridge.SendMessage(bridge.Message{
+		SendMessage(Message{
-			Type: bridge.Process,
+			Type: ProcessMessage,
 			Data: Process{
 				Id:       id,
 				Metadata: metadata,

core/status.go

@@ -0,0 +1,43 @@
+//go:build android
+
+package main
+
+import "C"
+import (
+	"encoding/json"
+	"fmt"
+)
+
+type AccessControl struct {
+	Mode              string   `json:"mode"`
+	AcceptList        []string `json:"acceptList"`
+	RejectList        []string `json:"rejectList"`
+	IsFilterSystemApp bool     `json:"isFilterSystemApp"`
+}
+
+type AndroidProps struct {
+	AccessControl *AccessControl `json:"accessControl"`
+	AllowBypass   bool           `json:"allowBypass"`
+	SystemProxy   bool           `json:"systemProxy"`
+}
+
+var androidProps AndroidProps
+
+//export getAndroidProps
+func getAndroidProps() *C.char {
+	data, err := json.Marshal(androidProps)
+	if err != nil {
+		fmt.Println("Error:", err)
+		return C.CString("")
+	}
+	return C.CString(string(data))
+}
+
+//export setAndroidProps
+func setAndroidProps(s *C.char) {
+	paramsString := C.GoString(s)
+	err := json.Unmarshal([]byte(paramsString), &androidProps)
+	if err != nil {
+		return
+	}
+}

core/tun.go

@@ -10,6 +10,7 @@ import (
 	"github.com/metacubex/mihomo/component/dialer"
 	"github.com/metacubex/mihomo/log"
 	"golang.org/x/sync/semaphore"
+	"strconv"
 	"sync"
 	"sync/atomic"
 	"syscall"
@@ -18,6 +19,7 @@ import (
 
 var tunLock sync.Mutex
 var tun *t.Tun
+var runTime *time.Time
 
 type FdMap struct {
 	m sync.Map
@@ -35,7 +37,9 @@ func (cm *FdMap) Load(key int64) bool {
 var fdMap FdMap
 
 //export startTUN
-func startTUN(fd C.int) {
+func startTUN(fd C.int, port C.longlong) {
+	i := int64(port)
+	ServicePort = i
 	go func() {
 		tunLock.Lock()
 		defer tunLock.Unlock()
@@ -44,6 +48,7 @@ func startTUN(fd C.int) {
 			tun.Close()
 			tun = nil
 		}
+
 		f := int(fd)
 		gateway := "172.16.0.1/30"
 		portal := "172.16.0.2"
@@ -61,15 +66,34 @@ func startTUN(fd C.int) {
 		tempTun.Closer = closer
 
 		tun = tempTun
+
+		now := time.Now()
+
+		runTime = &now
+
+		SendMessage(Message{
+			Type: StartedMessage,
+			Data: strconv.FormatInt(runTime.UnixMilli(), 10),
+		})
 	}()
 }
 
+//export getRunTime
+func getRunTime() *C.char {
+	if runTime == nil {
+		return C.CString("")
+	}
+	return C.CString(strconv.FormatInt(runTime.UnixMilli(), 10))
+}
+
 //export stopTun
 func stopTun() {
 	go func() {
 		tunLock.Lock()
 		defer tunLock.Unlock()
 
+		runTime = nil
+
 		if tun != nil {
 			tun.Close()
 			tun = nil
@@ -87,6 +111,18 @@ func setFdMap(fd C.long) {
 	}()
 }
 
+type Fd struct {
+	Id    int64 `json:"id"`
+	Value int64 `json:"value"`
+}
+
+func markSocket(fd Fd) {
+	SendMessage(Message{
+		Type: ProtectMessage,
+		Data: fd,
+	})
+}
+
 var fdCounter int64 = 0
 
 func init() {
@@ -102,7 +138,8 @@ func init() {
 			fdInt := int64(fd)
 			timeout := time.After(100 * time.Millisecond)
 			id := atomic.AddInt64(&fdCounter, 1)
-			tun.MarkSocket(t.Fd{
+
+			markSocket(Fd{
 				Id:    id,
 				Value: fdInt,
 			})

core/tun/tun.go

@@ -5,7 +5,6 @@ package tun
 import "C"
 import (
 	"context"
-	bridge "core/dart-bridge"
 	"encoding/binary"
 	"github.com/Kr328/tun2socket"
 	"github.com/Kr328/tun2socket/nat"
@@ -185,24 +184,3 @@ func Start(fd int, gateway, portal, dns string) (io.Closer, error) {
 
 	return stack, nil
 }
-
-type Fd struct {
-	Id    int64 `json:"id"`
-	Value int64 `json:"value"`
-}
-
-func (t *Tun) MarkSocket(fd Fd) {
-	_ = t.Limit.Acquire(context.Background(), 1)
-	defer t.Limit.Release(1)
-
-	if t.Closed {
-		return
-	}
-
-	message := &bridge.Message{
-		Type: bridge.Tun,
-		Data: fd,
-	}
-
-	bridge.SendMessage(*message)
-}

lib/application.dart

@@ -115,7 +115,6 @@ class ApplicationState extends State<Application> {
       lightColorScheme: lightDynamic,
       darkColorScheme: darkDynamic,
     );
-
     WidgetsBinding.instance.addPostFrameCallback((_) {
       globalState.appController.updateSystemColorSchemes(systemColorSchemes);
     });
@@ -138,55 +137,59 @@ class ApplicationState extends State<Application> {
   Widget build(context) {
     return AppStateContainer(
       child: ClashMessageContainer(
-        child: _buildApp(
+        child: Selector2<AppState, Config, ApplicationSelectorState>(
-          Selector2<AppState, Config, ApplicationSelectorState>(
+          selector: (_, appState, config) => ApplicationSelectorState(
-            selector: (_, appState, config) => ApplicationSelectorState(
+            locale: config.locale,
-              locale: config.locale,
+            themeMode: config.themeMode,
-              themeMode: config.themeMode,
+            primaryColor: config.primaryColor,
-              primaryColor: config.primaryColor,
-            ),
-            builder: (_, state, child) {
-              return DynamicColorBuilder(
-                builder: (lightDynamic, darkDynamic) {
-                  _updateSystemColorSchemes(lightDynamic, darkDynamic);
-                  return MaterialApp(
-                    navigatorKey: globalState.navigatorKey,
-                    localizationsDelegates: const [
-                      AppLocalizations.delegate,
-                      GlobalMaterialLocalizations.delegate,
-                      GlobalCupertinoLocalizations.delegate,
-                      GlobalWidgetsLocalizations.delegate
-                    ],
-                    title: appName,
-                    locale: other.getLocaleForString(state.locale),
-                    supportedLocales:
-                        AppLocalizations.delegate.supportedLocales,
-                    themeMode: state.themeMode,
-                    theme: ThemeData(
-                      useMaterial3: true,
-                      pageTransitionsTheme: _pageTransitionsTheme,
-                      colorScheme: _getAppColorScheme(
-                        brightness: Brightness.light,
-                        systemColorSchemes: systemColorSchemes,
-                        primaryColor: state.primaryColor,
-                      ),
-                    ),
-                    darkTheme: ThemeData(
-                      useMaterial3: true,
-                      pageTransitionsTheme: _pageTransitionsTheme,
-                      colorScheme: _getAppColorScheme(
-                        brightness: Brightness.dark,
-                        systemColorSchemes: systemColorSchemes,
-                        primaryColor: state.primaryColor,
-                      ),
-                    ),
-                    home: child,
-                  );
-                },
-              );
-            },
-            child: const HomePage(),
           ),
+          builder: (_, state, child) {
+            return DynamicColorBuilder(
+              builder: (lightDynamic, darkDynamic) {
+                _updateSystemColorSchemes(lightDynamic, darkDynamic);
+                return MaterialApp(
+                  debugShowCheckedModeBanner: false,
+                  navigatorKey: globalState.navigatorKey,
+                  localizationsDelegates: const [
+                    AppLocalizations.delegate,
+                    GlobalMaterialLocalizations.delegate,
+                    GlobalCupertinoLocalizations.delegate,
+                    GlobalWidgetsLocalizations.delegate
+                  ],
+                  builder: (_, child) {
+                    return PopContainer(
+                      child: _buildApp(child!),
+                    );
+                  },
+                  scrollBehavior: BaseScrollBehavior(),
+                  title: appName,
+                  locale: other.getLocaleForString(state.locale),
+                  supportedLocales: AppLocalizations.delegate.supportedLocales,
+                  themeMode: state.themeMode,
+                  theme: ThemeData(
+                    useMaterial3: true,
+                    pageTransitionsTheme: _pageTransitionsTheme,
+                    colorScheme: _getAppColorScheme(
+                      brightness: Brightness.light,
+                      systemColorSchemes: systemColorSchemes,
+                      primaryColor: state.primaryColor,
+                    ),
+                  ),
+                  darkTheme: ThemeData(
+                    useMaterial3: true,
+                    pageTransitionsTheme: _pageTransitionsTheme,
+                    colorScheme: _getAppColorScheme(
+                      brightness: Brightness.dark,
+                      systemColorSchemes: systemColorSchemes,
+                      primaryColor: state.primaryColor,
+                    ),
+                  ),
+                  home: child,
+                );
+              },
+            );
+          },
+          child: const HomePage(),
         ),
       ),
     );

lib/clash/core.dart

@@ -35,7 +35,6 @@ class ClashCore {
     clashFFI = ClashFFI(lib);
     clashFFI.initNativeApiBridge(
       NativeApi.initializeApiDLData,
-      receiver.sendPort.nativePort,
     );
   }
 
@@ -95,6 +94,28 @@ class ClashCore {
     return completer.future;
   }
 
+  initMessage() {
+    clashFFI.initMessage(
+      receiver.sendPort.nativePort,
+    );
+  }
+
+  setProfileName(String profileName) {
+    final profileNameChar = profileName.toNativeUtf8().cast<Char>();
+    clashFFI.setCurrentProfileName(
+      profileNameChar,
+    );
+    malloc.free(profileNameChar);
+  }
+
+  getProfileName() {
+    final currentProfileNameRaw = clashFFI.getCurrentProfileName();
+    final currentProfileName =
+        currentProfileNameRaw.cast<Utf8>().toDartString();
+    clashFFI.freeCString(currentProfileNameRaw);
+    return currentProfileName;
+  }
+
   Future<List<Group>> getProxiesGroups() {
     final proxiesRaw = clashFFI.getProxies();
     final proxiesRawString = proxiesRaw.cast<Utf8>().toDartString();
@@ -216,6 +237,21 @@ class ClashCore {
     return VersionInfo.fromJson(versionInfo);
   }
 
+  setProps(Props props) {
+    final propsChar = json.encode(props).toNativeUtf8().cast<Char>();
+    clashFFI.setAndroidProps(propsChar);
+    malloc.free(propsChar);
+  }
+
+  Props getProps() {
+    final androidPropsRaw = clashFFI.getAndroidProps();
+    final androidProps = json.decode(
+      androidPropsRaw.cast<Utf8>().toDartString(),
+    );
+    clashFFI.freeCString(androidPropsRaw);
+    return Props.fromJson(androidProps);
+  }
+
   Traffic getTraffic() {
     final trafficRaw = clashFFI.getTraffic();
     final trafficMap = json.decode(trafficRaw.cast<Utf8>().toDartString());
@@ -242,8 +278,9 @@ class ClashCore {
     clashFFI.stopLog();
   }
 
-  startTun(int fd) {
+  startTun(int fd, int port) {
-    clashFFI.startTUN(fd);
+    if (!Platform.isAndroid) return;
+    clashFFI.startTUN(fd, port);
   }
 
   requestGc() {
@@ -265,11 +302,13 @@ class ClashCore {
     clashFFI.setFdMap(fd);
   }
 
-  // DateTime? getRunTime() {
+  DateTime? getRunTime() {
-  //   final runTimeString = clashFFI.getRunTime().cast<Utf8>().toDartString();
+    final runTimeRaw = clashFFI.getRunTime();
-  //   if (runTimeString.isEmpty) return null;
+    final runTimeString = runTimeRaw.cast<Utf8>().toDartString();
-  //   return DateTime.fromMillisecondsSinceEpoch(int.parse(runTimeString));
+    clashFFI.freeCString(runTimeRaw);
-  // }
+    if (runTimeString.isEmpty) return null;
+    return DateTime.fromMillisecondsSinceEpoch(int.parse(runTimeString));
+  }
 
   List<Connection> getConnections() {
     final connectionsDataRaw = clashFFI.getConnections();

lib/clash/generated/clash_ffi.dart

@@ -5190,6 +5190,30 @@ class ClashFFI {
       _lookup<ffi.NativeFunction<ffi.Void Function()>>('forceGc');
   late final _forceGc = _forceGcPtr.asFunction<void Function()>();
 
+  void setCurrentProfileName(
+    ffi.Pointer<ffi.Char> s,
+  ) {
+    return _setCurrentProfileName(
+      s,
+    );
+  }
+
+  late final _setCurrentProfileNamePtr =
+      _lookup<ffi.NativeFunction<ffi.Void Function(ffi.Pointer<ffi.Char>)>>(
+          'setCurrentProfileName');
+  late final _setCurrentProfileName = _setCurrentProfileNamePtr
+      .asFunction<void Function(ffi.Pointer<ffi.Char>)>();
+
+  ffi.Pointer<ffi.Char> getCurrentProfileName() {
+    return _getCurrentProfileName();
+  }
+
+  late final _getCurrentProfileNamePtr =
+      _lookup<ffi.NativeFunction<ffi.Pointer<ffi.Char> Function()>>(
+          'getCurrentProfileName');
+  late final _getCurrentProfileName =
+      _getCurrentProfileNamePtr.asFunction<ffi.Pointer<ffi.Char> Function()>();
+
   void validateConfig(
     ffi.Pointer<ffi.Char> s,
     int port,
@@ -5406,20 +5430,30 @@ class ClashFFI {
 
   void initNativeApiBridge(
     ffi.Pointer<ffi.Void> api,
-    int port,
   ) {
     return _initNativeApiBridge(
       api,
+    );
+  }
+
+  late final _initNativeApiBridgePtr =
+      _lookup<ffi.NativeFunction<ffi.Void Function(ffi.Pointer<ffi.Void>)>>(
+          'initNativeApiBridge');
+  late final _initNativeApiBridge = _initNativeApiBridgePtr
+      .asFunction<void Function(ffi.Pointer<ffi.Void>)>();
+
+  void initMessage(
+    int port,
+  ) {
+    return _initMessage(
       port,
     );
   }
 
-  late final _initNativeApiBridgePtr = _lookup<
+  late final _initMessagePtr =
-      ffi.NativeFunction<
+      _lookup<ffi.NativeFunction<ffi.Void Function(ffi.LongLong)>>(
-          ffi.Void Function(
+          'initMessage');
-              ffi.Pointer<ffi.Void>, ffi.LongLong)>>('initNativeApiBridge');
+  late final _initMessage = _initMessagePtr.asFunction<void Function(int)>();
-  late final _initNativeApiBridge = _initNativeApiBridgePtr
-      .asFunction<void Function(ffi.Pointer<ffi.Void>, int)>();
 
   void freeCString(
     ffi.Pointer<ffi.Char> s,
@@ -5465,17 +5499,54 @@ class ClashFFI {
   late final _setProcessMap =
       _setProcessMapPtr.asFunction<void Function(ffi.Pointer<ffi.Char>)>();
 
+  ffi.Pointer<ffi.Char> getAndroidProps() {
+    return _getAndroidProps();
+  }
+
+  late final _getAndroidPropsPtr =
+      _lookup<ffi.NativeFunction<ffi.Pointer<ffi.Char> Function()>>(
+          'getAndroidProps');
+  late final _getAndroidProps =
+      _getAndroidPropsPtr.asFunction<ffi.Pointer<ffi.Char> Function()>();
+
+  void setAndroidProps(
+    ffi.Pointer<ffi.Char> s,
+  ) {
+    return _setAndroidProps(
+      s,
+    );
+  }
+
+  late final _setAndroidPropsPtr =
+      _lookup<ffi.NativeFunction<ffi.Void Function(ffi.Pointer<ffi.Char>)>>(
+          'setAndroidProps');
+  late final _setAndroidProps =
+      _setAndroidPropsPtr.asFunction<void Function(ffi.Pointer<ffi.Char>)>();
+
   void startTUN(
     int fd,
+    int port,
   ) {
     return _startTUN(
       fd,
+      port,
     );
   }
 
   late final _startTUNPtr =
-      _lookup<ffi.NativeFunction<ffi.Void Function(ffi.Int)>>('startTUN');
+      _lookup<ffi.NativeFunction<ffi.Void Function(ffi.Int, ffi.LongLong)>>(
-  late final _startTUN = _startTUNPtr.asFunction<void Function(int)>();
+          'startTUN');
+  late final _startTUN = _startTUNPtr.asFunction<void Function(int, int)>();
+
+  ffi.Pointer<ffi.Char> getRunTime() {
+    return _getRunTime();
+  }
+
+  late final _getRunTimePtr =
+      _lookup<ffi.NativeFunction<ffi.Pointer<ffi.Char> Function()>>(
+          'getRunTime');
+  late final _getRunTime =
+      _getRunTimePtr.asFunction<ffi.Pointer<ffi.Char> Function()>();
 
   void stopTun() {
     return _stopTun();

lib/clash/message.dart

@@ -7,24 +7,6 @@ import 'package:flutter/foundation.dart';
 
 import 'core.dart';
 
-abstract mixin class ClashMessageListener {
-  void onLog(Log log) {}
-
-  void onTun(Fd fd) {}
-
-  void onDelay(Delay delay) {}
-
-  void onProcess(Process process) {}
-
-  void onRequest(Connection connection) {}
-
-  void onNow(Now now) {}
-
-  void onRun(String runTime) {}
-
-  void onLoaded(String groupName) {}
-}
-
 class ClashMessage {
   StreamSubscription? subscription;
 
@@ -34,31 +16,22 @@ class ClashMessage {
       subscription = null;
     }
     subscription = ClashCore.receiver.listen((message) {
-      final m = Message.fromJson(json.decode(message));
+      final m = AppMessage.fromJson(json.decode(message));
-      for (final ClashMessageListener listener in _listeners) {
+      for (final AppMessageListener listener in _listeners) {
         switch (m.type) {
-          case MessageType.log:
+          case AppMessageType.log:
             listener.onLog(Log.fromJson(m.data));
             break;
-          case MessageType.tun:
+          case AppMessageType.delay:
-            listener.onTun(Fd.fromJson(m.data));
-            break;
-          case MessageType.delay:
             listener.onDelay(Delay.fromJson(m.data));
             break;
-          case MessageType.process:
+          case AppMessageType.request:
-            listener.onProcess(Process.fromJson(m.data));
-            break;
-          case MessageType.now:
-            listener.onNow(Now.fromJson(m.data));
-            break;
-          case MessageType.request:
             listener.onRequest(Connection.fromJson(m.data));
             break;
-          case MessageType.run:
+          case AppMessageType.started:
-            listener.onRun(m.data);
+            listener.onStarted(m.data);
             break;
-          case MessageType.loaded:
+          case AppMessageType.loaded:
             listener.onLoaded(m.data);
             break;
         }
@@ -68,18 +41,18 @@ class ClashMessage {
 
   static final ClashMessage instance = ClashMessage._();
 
-  final ObserverList<ClashMessageListener> _listeners =
+  final ObserverList<AppMessageListener> _listeners =
-      ObserverList<ClashMessageListener>();
+      ObserverList<AppMessageListener>();
 
   bool get hasListeners {
     return _listeners.isNotEmpty;
   }
 
-  void addListener(ClashMessageListener listener) {
+  void addListener(AppMessageListener listener) {
     _listeners.add(listener);
   }
 
-  void removeListener(ClashMessageListener listener) {
+  void removeListener(AppMessageListener listener) {
     _listeners.remove(listener);
   }
 }

lib/clash/service.dart

@@ -17,6 +17,7 @@ class ClashService {
     }
     const geoFileNameList = [
       mmdbFileName,
+      geoIpFileName,
       geoSiteFileName,
       asnFileName,
     ];

lib/common/android.dart

@@ -1,14 +1,10 @@
 import 'dart:io';
 
-import 'package:fl_clash/clash/clash.dart';
 import 'package:fl_clash/plugins/app.dart';
 
 class Android {
   init() async {
-    app?.onExit = () {
+    app?.onExit = () {};
-      clashCore.shutdown();
-      exit(0);
-    };
   }
 }
 

lib/common/common.dart

@@ -23,4 +23,6 @@ export 'app_localizations.dart';
 export 'function.dart';
 export 'package.dart';
 export 'measure.dart';
-export 'service.dart';
+export 'service.dart';
+export 'iterable.dart';
+export 'scroll.dart';

lib/common/constant.dart

@@ -1,6 +1,10 @@
+import 'dart:io';
 import 'dart:ui';
 
+import 'package:fl_clash/enum/enum.dart';
+import 'package:fl_clash/models/clash_config.dart';
 import 'package:flutter/material.dart';
+import 'system.dart';
 
 const appName = "FlClash";
 const coreName = "clash.meta";
@@ -10,8 +14,20 @@ const moreDuration = Duration(milliseconds: 100);
 const animateDuration = Duration(milliseconds: 100);
 const defaultUpdateDuration = Duration(days: 1);
 const mmdbFileName = "geoip.metadb";
-const geoSiteFileName = "GeoSite.dat";
 const asnFileName = "ASN.mmdb";
+const geoIpFileName = "GeoIP.dat";
+const geoSiteFileName = "GeoSite.dat";
+final double kHeaderHeight = system.isDesktop ? (Platform.isMacOS ? 28 : 40) : 0;
+const GeoXMap defaultGeoXMap = {
+  "mmdb":
+      "https://github.com/MetaCubeX/meta-rules-dat/releases/download/latest/geoip.metadb",
+  "asn":
+      "https://github.com/xishang0128/geoip/releases/download/latest/GeoLite2-ASN.mmdb",
+  "geoip":
+      "https://github.com/MetaCubeX/meta-rules-dat/releases/download/latest/GeoIP.dat",
+  "geosite":
+      "https://github.com/MetaCubeX/meta-rules-dat/releases/download/latest/geosite.dat"
+};
 const profilesDirectoryName = "profiles";
 const localhost = "127.0.0.1";
 const clashConfigKey = "clash_config";
@@ -31,4 +47,10 @@ final filter = ImageFilter.blur(
   tileMode: TileMode.mirror,
 );
 
+const viewModeColumnsMap = {
+  ViewMode.mobile: [2, 1],
+  ViewMode.laptop: [3, 2],
+  ViewMode.desktop: [4, 3],
+};
+
 const defaultPrimaryColor = Colors.brown;

lib/common/iterable.dart

@@ -0,0 +1,13 @@
+extension IterableExt<T> on Iterable<T> {
+  Iterable<T> separated(T separator) sync* {
+    final iterator = this.iterator;
+    if (!iterator.moveNext()) return;
+
+    yield iterator.current;
+
+    while (iterator.moveNext()) {
+      yield separator;
+      yield iterator.current;
+    }
+  }
+}

lib/common/other.dart

@@ -2,6 +2,7 @@ import 'dart:io';
 import 'dart:isolate';
 import 'dart:typed_data';
 
+import 'package:fl_clash/common/app_localizations.dart';
 import 'package:fl_clash/common/constant.dart';
 import 'package:fl_clash/enum/enum.dart';
 import 'package:flutter/material.dart';
@@ -39,6 +40,9 @@ class Other {
     }
     final diff = timeStamp / 1000;
     final inHours = (diff / 3600).floor();
+    if (inHours > 99) {
+      return "99:59:59";
+    }
     final inMinutes = (diff / 60 % 60).floor();
     final inSeconds = (diff % 60).floor();
 
@@ -97,9 +101,9 @@ class Other {
 
   String getTrayIconPath() {
     if (Platform.isWindows) {
-      return "assets/images/app_icon.ico";
+      return "assets/images/icon.ico";
     } else {
-      return "assets/images/launch_icon.png";
+      return "assets/images/icon_monochrome.png";
     }
   }
 
@@ -171,7 +175,7 @@ class Other {
   }
 
   List<String> parseReleaseBody(String? body) {
-    if(body == null) return [];
+    if (body == null) return [];
     const pattern = r'- (.+?)\. \[.+?\]';
     final regex = RegExp(pattern);
     return regex
@@ -181,11 +185,29 @@ class Other {
         .toList();
   }
 
-  ViewMode getViewMode(double viewWidth){
+  ViewMode getViewMode(double viewWidth) {
     if (viewWidth <= maxMobileWidth) return ViewMode.mobile;
     if (viewWidth <= maxLaptopWidth) return ViewMode.laptop;
     return ViewMode.desktop;
   }
+
+  int getColumns(ViewMode viewMode, int currentColumns) {
+    final targetColumnsArray = viewModeColumnsMap[viewMode]!;
+    if (targetColumnsArray.contains(currentColumns)) {
+      return currentColumns;
+    }
+    return targetColumnsArray.first;
+  }
+
+  String getColumnsTextForInt(int number){
+    return switch(number){
+      1 => appLocalizations.oneColumn,
+      2 => appLocalizations.twoColumns,
+      3 => appLocalizations.threeColumns,
+      4 => appLocalizations.fourColumns,
+      int() => throw UnimplementedError(),
+    };
+  }
 }
 
 final other = Other();

lib/common/package.dart

@@ -7,7 +7,7 @@ import 'common.dart';
 extension PackageInfoExtension on PackageInfo {
   String get ua => [
         "$appName/v$version",
-        "clash-verge/v1.6.6",
+        "clash-verge",
         "Platform/${Platform.operatingSystem}",
       ].join(" ");
 }

lib/common/picker.dart

@@ -1,29 +1,22 @@
-import 'dart:io';
-
 import 'package:file_picker/file_picker.dart';
 import 'package:fl_clash/common/common.dart';
 import 'package:image_picker/image_picker.dart';
 
 class Picker {
   Future<PlatformFile?> pickerConfigFile() async {
-    FilePickerResult? filePickerResult;
+    final filePickerResult = await FilePicker.platform.pickFiles(
-    if (Platform.isAndroid) {
+      withData: true,
-      filePickerResult = await FilePicker.platform.pickFiles(
+      allowMultiple: false,
-        withData: true,
+    );
-        allowMultiple: false,
+    return filePickerResult?.files.first;
-      );
+  }
-    } else {
+
-      filePickerResult = await FilePicker.platform.pickFiles(
+  Future<PlatformFile?> pickerGeoDataFile() async {
-        withData: true,
+    final filePickerResult = await FilePicker.platform.pickFiles(
-        type: FileType.custom,
+      withData: true,
-        allowedExtensions: ['yaml', 'txt', 'conf'],
+      allowMultiple: false,
-      );
+    );
-    }
+    return filePickerResult?.files.first;
-    final file = filePickerResult?.files.first;
-    if (file == null) {
-      return null;
-    }
-    return file;
   }
 
   Future<String?> pickerConfigQRCode() async {

lib/common/proxy.dart

@@ -15,8 +15,8 @@ class ProxyManager {
 
   DateTime? get startTime => _proxy.startTime;
 
-  Future<bool?> startProxy({required int port, String? args}) async {
+  Future<bool?> startProxy({required int port}) async {
-    return await _proxy.startProxy(port, args);
+    return await _proxy.startProxy(port);
   }
 
   Future<bool?> stopProxy() async {
@@ -28,20 +28,6 @@ class ProxyManager {
     return await (_proxy as Proxy).updateStartTime();
   }
 
-  Future<bool?> setProtect(int fd) async {
-    if (_proxy is! Proxy) return null;
-    return await (_proxy as Proxy).setProtect(fd);
-  }
-
-  Future<bool?> startForeground({
-    required String title,
-    required String content,
-  }) async {
-    if (_proxy is! Proxy) return null;
-    return await (_proxy as Proxy)
-        .startForeground(title: title, content: content);
-  }
-
   factory ProxyManager() {
     _instance ??= ProxyManager._internal();
     return _instance!;

lib/common/request.dart

@@ -19,14 +19,14 @@ class Request {
     _dio.interceptors.add(
       InterceptorsWrapper(
         onRequest: (options, handler) {
-          _syncProxy();
+          _updateAdapter();
           return handler.next(options); // 继续请求
         },
       ),
     );
   }
 
-  _syncProxy() {
+  _updateAdapter() {
     final port = globalState.appController.clashConfig.mixedPort;
     final isStart = globalState.appController.appState.isStart;
     if (_port != port || isStart != _isStart) {
@@ -36,11 +36,13 @@ class Request {
         createHttpClient: () {
           final client = HttpClient();
           if (!_isStart) return client;
+          client.userAgent = globalState.appController.clashConfig.globalUa;
           client.findProxy = (url) {
             return "PROXY localhost:$_port;DIRECT";
           };
           return client;
         },
+        validateCertificate: (_, __, ___) => true,
       );
     }
   }

lib/common/scroll.dart

@@ -0,0 +1,16 @@
+import 'dart:ui';
+
+import 'package:fl_clash/common/common.dart';
+import 'package:flutter/material.dart';
+
+class BaseScrollBehavior extends MaterialScrollBehavior {
+  @override
+  Set<PointerDeviceKind> get dragDevices => {
+        PointerDeviceKind.touch,
+        PointerDeviceKind.stylus,
+        PointerDeviceKind.invertedStylus,
+        PointerDeviceKind.trackpad,
+        if (system.isDesktop) PointerDeviceKind.mouse,
+        PointerDeviceKind.unknown,
+      };
+}

lib/common/string.dart

@@ -1,9 +1,5 @@
 extension StringExtension on String {
   bool get isUrl {
-    return RegExp(
+    return RegExp(r'^(http|https|ftp)://').hasMatch(this);
-      r"^(http(s)?://)?(www\.)?[a-zA-Z0-9]+([\-.][a-zA-Z0-9]+)*\.[a-zA-Z]{2,5}(:[0-9]{1,5})?(/.*)?$",
-      caseSensitive: false,
-      multiLine: false,
-    ).hasMatch(this);
   }
 }

lib/common/window.dart

@@ -1,5 +1,6 @@
 import 'dart:io';
 
+import 'package:fl_clash/models/config.dart';
 import 'package:flutter/material.dart';
 import 'package:window_manager/window_manager.dart';
 import 'package:windows_single_instance/windows_single_instance.dart';
@@ -8,7 +9,7 @@ import 'protocol.dart';
 import 'system.dart';
 
 class Window {
-  init() async {
+  init(WindowProps props) async {
     if (Platform.isWindows) {
       await WindowsSingleInstance.ensureSingleInstance([], "FlClash");
       protocol.register("clash");
@@ -16,11 +17,21 @@ class Window {
       protocol.register("flclash");
     }
     await windowManager.ensureInitialized();
-    WindowOptions windowOptions = const WindowOptions(
+    WindowOptions windowOptions = WindowOptions(
-      size: Size(1000, 600),
+      size: Size(props.width, props.height),
-      minimumSize: Size(400, 600),
+      minimumSize: const Size(380, 600),
-      center: true,
+      titleBarStyle: TitleBarStyle.hidden,
     );
+    if (props.left != null || props.top != null) {
+      await windowManager.setPosition(
+        Offset(props.left ?? 0, props.top ?? 0),
+      );
+    } else {
+      await windowManager.setAlignment(Alignment.center);
+    }
+    // if(Platform.isWindows){
+    //   await windowManager.setTitleBarStyle(TitleBarStyle.hidden);
+    // }
     await windowManager.waitUntilReadyToShow(windowOptions, () async {
       await windowManager.setPreventClose(true);
     });

lib/controller.dart

@@ -17,6 +17,7 @@ class AppController {
   late ClashConfig clashConfig;
   late Measure measure;
   late Function updateClashConfigDebounce;
+  late Function addCheckIpNumDebounce;
 
   AppController(this.context) {
     appState = context.read<AppState>();
@@ -25,6 +26,9 @@ class AppController {
     updateClashConfigDebounce = debounce<Function()>(() async {
       await updateClashConfig();
     });
+    addCheckIpNumDebounce = debounce(() {
+      appState.checkIpNum++;
+    });
     measure = Measure.of(context);
   }
 
@@ -66,7 +70,6 @@ class AppController {
 
   updateTraffic() {
     globalState.updateTraffic(
-      config: config,
       appState: appState,
     );
   }
@@ -117,6 +120,14 @@ class AppController {
     });
   }
 
+  Future rawApplyProfile() async {
+    await globalState.applyProfile(
+      appState: appState,
+      config: config,
+      clashConfig: clashConfig,
+    );
+  }
+
   changeProfile(String? value) async {
     if (value == config.currentProfileId) return;
     config.currentProfileId = value;
@@ -400,14 +411,7 @@ class AppController {
   }
 
   int get columns =>
-      globalState.getColumns(appState.viewMode, config.proxiesColumns);
+      other.getColumns(appState.viewMode, config.proxiesColumns);
-
-  changeColumns() {
-    config.proxiesColumns = globalState.getColumns(
-      appState.viewMode,
-      columns - 1,
-    );
-  }
 
   updateViewWidth(double width) {
     WidgetsBinding.instance.addPostFrameCallback((_) {

lib/enum/enum.dart

@@ -56,14 +56,18 @@ enum ProfileType { file, url }
 
 enum ResultType { success, error }
 
-enum MessageType {
+enum AppMessageType {
   log,
-  tun,
   delay,
-  process,
-  now,
   request,
-  run,
+  started,
+  loaded,
+}
+
+enum ServiceMessageType {
+  protect,
+  process,
+  started,
   loaded,
 }
 
@@ -78,6 +82,6 @@ enum ChipType { action, delete }
 
 enum CommonCardType { plain, filled }
 
-enum ProxiesType { tab, expansion }
+enum ProxiesType { tab, list }
 
-enum ProxyCardType { expand, shrink }
+enum ProxyCardType { expand, shrink, min }

lib/fragments/about.dart

@@ -1,16 +1,29 @@
 import 'package:fl_clash/common/common.dart';
 import 'package:fl_clash/state.dart';
+import 'package:fl_clash/widgets/list.dart';
 import 'package:flutter/material.dart';
 import 'package:url_launcher/url_launcher.dart';
 
+@immutable
+class Contributor {
+  final String avatar;
+  final String name;
+  final String link;
+
+  const Contributor({
+    required this.avatar,
+    required this.name,
+    required this.link,
+  });
+}
+
 class AboutFragment extends StatelessWidget {
   const AboutFragment({super.key});
 
   _checkUpdate(BuildContext context) async {
     final commonScaffoldState = context.commonScaffoldState;
     if (commonScaffoldState?.mounted != true) return;
-    final data =
+    final data = await commonScaffoldState?.loadingRun<Map<String, dynamic>?>(
-        await commonScaffoldState?.loadingRun<Map<String, dynamic>?>(
       request.checkForUpdate,
       title: appLocalizations.checkUpdate,
     );
@@ -20,84 +33,40 @@ class AboutFragment extends StatelessWidget {
     );
   }
 
-  @override
+  List<Widget> _buildMoreSection(BuildContext context) {
-  Widget build(BuildContext context) {
+    return generateSection(
-    return ListView(
+      separated: false,
-      padding: kMaterialListPadding.copyWith(
+      title: appLocalizations.more,
-        top: 16,
+      items: [
-        bottom: 16,
+        ListItem(
-      ),
-      children: [
-        ListTile(
-          title: Column(
-            crossAxisAlignment: CrossAxisAlignment.start,
-            children: [
-              Wrap(
-                spacing: 16,
-                crossAxisAlignment: WrapCrossAlignment.center,
-                children: [
-                  Image.asset(
-                    'assets/images/launch_icon.png',
-                    width: 100,
-                    height: 100,
-                  ),
-                  Column(
-                    crossAxisAlignment: CrossAxisAlignment.start,
-                    children: [
-                      Text(
-                        appName,
-                        style: Theme.of(context).textTheme.headlineSmall,
-                      ),
-                      Text(
-                        globalState.packageInfo.version,
-                        style: Theme.of(context).textTheme.labelLarge,
-                      )
-                    ],
-                  )
-                ],
-              ),
-              const SizedBox(
-                height: 24,
-              ),
-              Text(
-                appLocalizations.desc,
-                style: Theme.of(context).textTheme.bodySmall,
-              ),
-            ],
-          ),
-        ),
-        const SizedBox(
-          height: 12,
-        ),
-        ListTile(
           title: Text(appLocalizations.checkUpdate),
           onTap: () {
             _checkUpdate(context);
           },
         ),
-        ListTile(
+        ListItem(
           title: const Text("Telegram"),
           onTap: () {
-            launchUrl(
+            globalState.openUrl(
-              Uri.parse("https://t.me/+G-veVtwBOl4wODc1"),
+              "https://t.me/+G-veVtwBOl4wODc1",
             );
           },
           trailing: const Icon(Icons.launch),
         ),
-        ListTile(
+        ListItem(
           title: Text(appLocalizations.project),
           onTap: () {
-            launchUrl(
+            globalState.openUrl(
-              Uri.parse("https://github.com/$repository"),
+              "https://github.com/$repository",
             );
           },
           trailing: const Icon(Icons.launch),
         ),
-        ListTile(
+        ListItem(
           title: Text(appLocalizations.core),
           onTap: () {
-            launchUrl(
+            globalState.openUrl(
-              Uri.parse("https://github.com/chen08209/Clash.Meta/tree/FlClash"),
+              "https://github.com/chen08209/Clash.Meta/tree/FlClash",
             );
           },
           trailing: const Icon(Icons.launch),
@@ -105,4 +74,139 @@ class AboutFragment extends StatelessWidget {
       ],
     );
   }
+
+  List<Widget> _buildContributorsSection() {
+    const contributors = [
+      Contributor(
+        avatar: "assets/images/avatars/june2.jpg",
+        name: "June2",
+        link: "https://t.me/Jibadong",
+      ),
+      Contributor(
+        avatar: "assets/images/avatars/arue.jpg",
+        name: "Arue",
+        link: "https://t.me/xrcm6868",
+      ),
+    ];
+    return generateSection(
+      separated: false,
+      title: appLocalizations.contributors,
+      items: [
+        ListItem(
+          title: SingleChildScrollView(
+            scrollDirection: Axis.horizontal,
+            child: Wrap(
+              spacing: 24,
+              children: [
+                for (final contributor in contributors)
+                  Avatar(
+                    contributor: contributor,
+                  ),
+              ],
+            ),
+          ),
+        )
+      ],
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final items = [
+      ListTile(
+        title: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Wrap(
+              spacing: 16,
+              crossAxisAlignment: WrapCrossAlignment.center,
+              children: [
+                Padding(
+                  padding: const EdgeInsets.all(12),
+                  child: Image.asset(
+                    'assets/images/icon.png',
+                    width: 64,
+                    height: 64,
+                  ),
+                ),
+                Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Text(
+                      appName,
+                      style: Theme.of(context).textTheme.headlineSmall,
+                    ),
+                    Text(
+                      globalState.packageInfo.version,
+                      style: Theme.of(context).textTheme.labelLarge,
+                    )
+                  ],
+                )
+              ],
+            ),
+            const SizedBox(
+              height: 24,
+            ),
+            Text(
+              appLocalizations.desc,
+              style: Theme.of(context).textTheme.bodySmall,
+            ),
+          ],
+        ),
+      ),
+      const SizedBox(
+        height: 12,
+      ),
+      ..._buildContributorsSection(),
+      ..._buildMoreSection(context),
+    ];
+    return Padding(
+      padding: kMaterialListPadding.copyWith(
+        top: 16,
+        bottom: 16,
+      ),
+      child: generateListView(items),
+    );
+  }
+}
+
+class Avatar extends StatelessWidget {
+  final Contributor contributor;
+
+  const Avatar({
+    super.key,
+    required this.contributor,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return InkWell(
+      splashColor: Colors.transparent,
+      highlightColor: Colors.transparent,
+      hoverColor: Colors.transparent,
+      child: Column(
+        children: [
+          SizedBox(
+            width: 36,
+            height: 36,
+            child: CircleAvatar(
+              foregroundImage: AssetImage(
+                contributor.avatar,
+              ),
+            ),
+          ),
+          const SizedBox(
+            height: 4,
+          ),
+          Text(
+            contributor.name,
+            style: context.textTheme.bodySmall,
+          )
+        ],
+      ),
+      onTap: () {
+        globalState.openUrl(contributor.link);
+      },
+    );
+  }
 }

lib/fragments/access.dart

@@ -35,7 +35,6 @@ class _AccessFragmentState extends State<AccessFragment> {
     });
   }
 
-
   @override
   void dispose() {
     super.dispose();
@@ -112,55 +111,48 @@ class _AccessFragmentState extends State<AccessFragment> {
     );
   }
 
-  _buildSelectedAllButton({
+  Widget _buildSelectedAllButton({
     required bool isAccessControl,
     required bool isSelectedAll,
     required List<String> allValueList,
   }) {
-    WidgetsBinding.instance.addPostFrameCallback((_) {
+    final tooltip = isSelectedAll
-      final tooltip = isSelectedAll
+        ? appLocalizations.cancelSelectAll
-          ? appLocalizations.cancelSelectAll
+        : appLocalizations.selectAll;
-          : appLocalizations.selectAll;
+    return AbsorbPointer(
-      final commonScaffoldState =
+      absorbing: !isAccessControl,
-          context.findAncestorStateOfType<CommonScaffoldState>();
+      child: FloatingActionButton(
-      commonScaffoldState?.floatingActionButton = DisabledMask(
+        tooltip: tooltip,
-        status: !isAccessControl,
+        onPressed: () {
-        child: AbsorbPointer(
+          final config = globalState.appController.config;
-          absorbing: !isAccessControl,
+          final isAccept =
-          child: FloatingActionButton (
+              config.accessControl.mode == AccessControlMode.acceptSelected;
-            tooltip: tooltip,
-            onPressed: () {
-              final config = globalState.appController.config;
-              final isAccept =
-                  config.accessControl.mode == AccessControlMode.acceptSelected;
 
-              if (isSelectedAll) {
+          if (isSelectedAll) {
-                config.accessControl = switch (isAccept) {
+            config.accessControl = switch (isAccept) {
-                  true => config.accessControl.copyWith(
+              true => config.accessControl.copyWith(
-                      acceptList: [],
+                  acceptList: [],
-                    ),
+                ),
-                  false => config.accessControl.copyWith(
+              false => config.accessControl.copyWith(
-                      rejectList: [],
+                  rejectList: [],
-                    ),
+                ),
-                };
+            };
-              } else {
+          } else {
-                config.accessControl = switch (isAccept) {
+            config.accessControl = switch (isAccept) {
-                  true => config.accessControl.copyWith(
+              true => config.accessControl.copyWith(
-                      acceptList: allValueList,
+                  acceptList: allValueList,
-                    ),
+                ),
-                  false => config.accessControl.copyWith(
+              false => config.accessControl.copyWith(
-                      rejectList: allValueList,
+                  rejectList: allValueList,
-                    ),
+                ),
-                };
+            };
-              }
+          }
-            },
+        },
-            child: isSelectedAll
+        child: isSelectedAll
-                ? const Icon(Icons.deselect)
+            ? const Icon(Icons.deselect)
-                : const Icon(Icons.select_all),
+            : const Icon(Icons.select_all),
-          ),
+      ),
-        ),
+    );
-      );
-    });
   }
 
   Widget _buildPackageList() {
@@ -213,137 +205,141 @@ class _AccessFragmentState extends State<AccessFragment> {
                 accessControlMode == AccessControlMode.acceptSelected
                     ? appLocalizations.accessControlAllowDesc
                     : appLocalizations.accessControlNotAllowDesc;
-            _buildSelectedAllButton(
-              isAccessControl: isAccessControl,
-              isSelectedAll: valueList.length == packageNameList.length,
-              allValueList: packageNameList,
-            );
             return DisabledMask(
               status: !isAccessControl,
-              child: Column(
+              child: FloatLayout(
-                children: [
+                floatingWidget: FloatWrapper(
-                  AbsorbPointer(
+                  child: _buildSelectedAllButton(
-                    absorbing: !isAccessControl,
+                    isAccessControl: isAccessControl,
-                    child: Padding(
+                    isSelectedAll: valueList.length == packageNameList.length,
-                      padding: const EdgeInsets.only(
+                    allValueList: packageNameList,
-                        top: 4,
+                  ),
-                        bottom: 4,
+                ),
-                        left: 16,
+                child: Column(
-                        right: 8,
+                  children: [
-                      ),
+                    AbsorbPointer(
-                      child: Row(
+                      absorbing: !isAccessControl,
-                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                      child: Padding(
-                        mainAxisSize: MainAxisSize.max,
+                        padding: const EdgeInsets.only(
-                        children: [
+                          top: 4,
-                          Expanded(
+                          bottom: 4,
-                            child: IntrinsicHeight(
+                          left: 16,
-                              child: Column(
+                          right: 8,
-                                mainAxisSize: MainAxisSize.max,
+                        ),
-                                crossAxisAlignment: CrossAxisAlignment.start,
+                        child: Row(
-                                children: [
+                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                                  Expanded(
+                          mainAxisSize: MainAxisSize.max,
-                                    child: Row(
+                          children: [
-                                      children: [
+                            Expanded(
-                                        Flexible(
+                              child: IntrinsicHeight(
-                                          child: Text(
+                                child: Column(
-                                            appLocalizations.selected,
+                                  mainAxisSize: MainAxisSize.max,
-                                            style: Theme.of(context)
+                                  crossAxisAlignment: CrossAxisAlignment.start,
-                                                .textTheme
+                                  children: [
-                                                .labelLarge
+                                    Expanded(
-                                                ?.copyWith(
+                                      child: Row(
-                                                  color: Theme.of(context)
+                                        children: [
-                                                      .colorScheme
+                                          Flexible(
-                                                      .primary,
+                                            child: Text(
-                                                ),
+                                              appLocalizations.selected,
+                                              style: Theme.of(context)
+                                                  .textTheme
+                                                  .labelLarge
+                                                  ?.copyWith(
+                                                    color: Theme.of(context)
+                                                        .colorScheme
+                                                        .primary,
+                                                  ),
+                                            ),
                                           ),
-                                        ),
+                                          const Flexible(
-                                        const Flexible(
+                                            child: SizedBox(
-                                          child: SizedBox(
+                                              width: 8,
-                                            width: 8,
+                                            ),
                                           ),
-                                        ),
+                                          Flexible(
-                                        Flexible(
+                                            child: Text(
-                                          child: Text(
+                                              "${valueList.length}",
-                                            "${valueList.length}",
+                                              style: Theme.of(context)
-                                            style: Theme.of(context)
+                                                  .textTheme
-                                                .textTheme
+                                                  .labelLarge
-                                                .labelLarge
+                                                  ?.copyWith(
-                                                ?.copyWith(
+                                                    color: Theme.of(context)
-                                                  color: Theme.of(context)
+                                                        .colorScheme
-                                                      .colorScheme
+                                                        .primary,
-                                                      .primary,
+                                                  ),
-                                                ),
+                                            ),
                                           ),
-                                        ),
+                                        ],
-                                      ],
+                                      ),
                                     ),
-                                  ),
+                                    Flexible(
-                                  Flexible(
+                                      child: Text(describe),
-                                    child: Text(describe),
+                                    )
-                                  )
+                                  ],
-                                ],
+                                ),
                               ),
                             ),
-                          ),
+                            Row(
-                          Row(
+                              mainAxisSize: MainAxisSize.min,
-                            mainAxisSize: MainAxisSize.min,
+                              mainAxisAlignment: MainAxisAlignment.end,
-                            mainAxisAlignment: MainAxisAlignment.end,
+                              children: [
-                            children: [
+                                Flexible(
-                              Flexible(
+                                    child: _buildSearchButton(currentPackages)),
-                                  child: _buildSearchButton(currentPackages)),
+                                Flexible(child: _buildFilterSystemAppButton()),
-                              Flexible(child: _buildFilterSystemAppButton()),
+                                Flexible(child: _buildAppProxyModePopup()),
-                              Flexible(child: _buildAppProxyModePopup()),
+                              ],
-                            ],
+                            ),
-                          ),
+                          ],
-                        ],
+                        ),
                       ),
                     ),
-                  ),
+                    Expanded(
-                  Expanded(
+                      flex: 1,
-                    flex: 1,
+                      child: FadeBox(
-                    child: FadeBox(
+                        key: const Key("fade_box"),
-                      key: const Key("fade_box"),
+                        child: currentPackages.isEmpty
-                      child: currentPackages.isEmpty
+                            ? const Center(
-                          ? const Center(
+                                child: CircularProgressIndicator(),
-                              child: CircularProgressIndicator(),
+                              )
-                            )
+                            : ListView.builder(
-                          : ListView.builder(
+                                itemCount: currentPackages.length,
-                              itemCount: currentPackages.length,
+                                itemBuilder: (_, index) {
-                              itemBuilder: (_, index) {
+                                  final package = currentPackages[index];
-                                final package = currentPackages[index];
+                                  return PackageListItem(
-                                return PackageListItem(
+                                    key: Key(package.packageName),
-                                  key: Key(package.packageName),
+                                    package: package,
-                                  package: package,
+                                    value:
-                                  value:
+                                        valueList.contains(package.packageName),
-                                      valueList.contains(package.packageName),
+                                    isActive: isAccessControl,
-                                  isActive: isAccessControl,
+                                    onChanged: (value) {
-                                  onChanged: (value) {
+                                      if (value == true) {
-                                    if (value == true) {
+                                        valueList.add(package.packageName);
-                                      valueList.add(package.packageName);
+                                      } else {
-                                    } else {
+                                        valueList.remove(package.packageName);
-                                      valueList.remove(package.packageName);
+                                      }
-                                    }
+                                      final config =
-                                    final config =
+                                          globalState.appController.config;
-                                        globalState.appController.config;
+                                      if (accessControlMode ==
-                                    if (accessControlMode ==
+                                          AccessControlMode.acceptSelected) {
-                                        AccessControlMode.acceptSelected) {
+                                        config.accessControl =
-                                      config.accessControl =
+                                            config.accessControl.copyWith(
-                                          config.accessControl.copyWith(
+                                          acceptList: valueList,
-                                        acceptList: valueList,
+                                        );
-                                      );
+                                      } else {
-                                    } else {
+                                        config.accessControl =
-                                      config.accessControl =
+                                            config.accessControl.copyWith(
-                                          config.accessControl.copyWith(
+                                          rejectList: valueList,
-                                        rejectList: valueList,
+                                        );
-                                      );
+                                      }
-                                    }
+                                    },
-                                  },
+                                  );
-                                );
+                                },
-                              },
+                              ),
-                            ),
+                      ),
                     ),
-                  ),
+                  ],
-                ],
+                ),
               ),
             );
           },

lib/fragments/application_setting.dart

@@ -89,6 +89,24 @@ class ApplicationSettingFragment extends StatelessWidget {
           );
         },
       ),
+      if (Platform.isAndroid)
+        Selector<Config, bool>(
+          selector: (_, config) => config.isExclude,
+          builder: (_, isExclude, child) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.visibility_off),
+              title: Text(appLocalizations.exclude),
+              subtitle: Text(appLocalizations.excludeDesc),
+              delegate: SwitchDelegate(
+                value: isExclude,
+                onChanged: (value) {
+                  final config = context.read<Config>();
+                  config.isExclude = value;
+                },
+              ),
+            );
+          },
+        ),
       if (Platform.isAndroid)
         Selector<Config, bool>(
           selector: (_, config) => config.isAnimateToPage,

lib/fragments/backup_and_recovery.dart

@@ -6,7 +6,6 @@ import 'package:fl_clash/models/dav.dart';
 import 'package:fl_clash/state.dart';
 import 'package:fl_clash/widgets/fade_box.dart';
 import 'package:fl_clash/widgets/list.dart';
-import 'package:fl_clash/widgets/section.dart';
 import 'package:fl_clash/widgets/text.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
@@ -34,9 +33,9 @@ class _BackupAndRecoveryState extends State<BackupAndRecovery> {
     final res = await commonScaffoldState?.loadingRun<bool>(() async {
       return await _client?.backup();
     });
-    if(res != true) return;
+    if (res != true) return;
     globalState.showMessage(
-      title: appLocalizations.recovery,
+      title: appLocalizations.backup,
       message: TextSpan(text: appLocalizations.backupSuccess),
     );
   }
@@ -46,7 +45,7 @@ class _BackupAndRecoveryState extends State<BackupAndRecovery> {
     final res = await commonScaffoldState?.loadingRun<bool>(() async {
       return await _client?.recovery(recoveryOption: recoveryOption);
     });
-    if(res != true) return;
+    if (res != true) return;
     globalState.showMessage(
       title: appLocalizations.recovery,
       message: TextSpan(text: appLocalizations.recoverySuccess),
@@ -69,26 +68,22 @@ class _BackupAndRecoveryState extends State<BackupAndRecovery> {
         if (dav == null) {
           return ListView(
             children: [
-              Section(
+              ListHeader(
                 title: appLocalizations.account,
-                child: Builder(
+              ),
-                  builder: (_) {
+              ListItem(
-                    return ListItem(
+                leading: const Icon(Icons.account_box),
-                      leading: const Icon(Icons.account_box),
+                title: Text(appLocalizations.noInfo),
-                      title: Text(appLocalizations.noInfo),
+                subtitle: Text(appLocalizations.pleaseBindWebDAV),
-                      subtitle: Text(appLocalizations.pleaseBindWebDAV),
+                trailing: FilledButton.tonal(
-                      trailing: FilledButton.tonal(
+                  onPressed: () {
-                        onPressed: () {
+                    _showAddWebDAV(dav);
-                          _showAddWebDAV(dav);
-                        },
-                        child: Text(
-                          appLocalizations.bind,
-                        ),
-                      ),
-                    );
                   },
+                  child: Text(
+                    appLocalizations.bind,
+                  ),
                 ),
-              )
+              ),
             ],
           );
         }
@@ -96,62 +91,59 @@ class _BackupAndRecoveryState extends State<BackupAndRecovery> {
         final pingFuture = _client!.pingCompleter.future;
         return ListView(
           children: [
-            Section(
+            ListHeader(title: appLocalizations.account),
-              title: appLocalizations.account,
+            ListItem(
-              child: ListItem(
+              leading: const Icon(Icons.account_box),
-                leading: const Icon(Icons.account_box),
+              title: TooltipText(
-                title: TooltipText(
+                text: Text(
-                  text: Text(
+                  dav.user,
-                    dav.user,
+                  maxLines: 1,
-                    maxLines: 1,
+                  overflow: TextOverflow.ellipsis,
-                    overflow: TextOverflow.ellipsis,
-                  ),
                 ),
-                subtitle: Padding(
+              ),
-                  padding: const EdgeInsets.symmetric(vertical: 4),
+              subtitle: Padding(
-                  child: Row(
+                padding: const EdgeInsets.symmetric(vertical: 4),
-                    crossAxisAlignment: CrossAxisAlignment.center,
+                child: Row(
-                    children: [
+                  crossAxisAlignment: CrossAxisAlignment.center,
-                      Text(appLocalizations.connectivity),
+                  children: [
-                      FutureBuilder<bool>(
+                    Text(appLocalizations.connectivity),
-                        future: pingFuture,
+                    FutureBuilder<bool>(
-                        builder: (_, snapshot) {
+                      future: pingFuture,
-                          return Center(
+                      builder: (_, snapshot) {
-                            child: FadeBox(
+                        return Center(
-                              key: const Key("fade_box_1"),
+                          child: FadeBox(
-                              child: snapshot.connectionState ==
+                            key: const Key("fade_box_1"),
-                                      ConnectionState.waiting
+                            child: snapshot.connectionState == ConnectionState.waiting
-                                  ? const SizedBox(
+                                ? const SizedBox(
-                                      width: 12,
+                                    width: 12,
-                                      height: 12,
+                                    height: 12,
-                                      child: CircularProgressIndicator(
+                                    child: CircularProgressIndicator(
-                                        strokeWidth: 1,
+                                      strokeWidth: 1,
-                                      ),
-                                    )
-                                  : Container(
-                                      decoration: BoxDecoration(
-                                        shape: BoxShape.circle,
-                                        color: snapshot.data == true
-                                            ? Colors.green
-                                            : Colors.red,
-                                      ),
-                                      width: 12,
-                                      height: 12,
                                     ),
-                            ),
+                                  )
-                          );
+                                : Container(
-                        },
+                                    decoration: BoxDecoration(
-                      ),
+                                      shape: BoxShape.circle,
-                    ],
+                                      color: snapshot.data == true
-                  ),
+                                          ? Colors.green
+                                          : Colors.red,
+                                    ),
+                                    width: 12,
+                                    height: 12,
+                                  ),
+                          ),
+                        );
+                      },
+                    ),
+                  ],
                 ),
-                trailing: FilledButton.tonal(
+              ),
-                  onPressed: () {
+              trailing: FilledButton.tonal(
-                    _showAddWebDAV(dav);
+                onPressed: () {
-                  },
+                  _showAddWebDAV(dav);
-                  child: Text(
+                },
-                    appLocalizations.edit,
+                child: Text(
-                  ),
+                  appLocalizations.edit,
                 ),
               ),
             ),
@@ -161,22 +153,21 @@ class _BackupAndRecoveryState extends State<BackupAndRecovery> {
                 return FadeBox(
                   key: const Key("fade_box_2"),
                   child: snapshot.data == true
-                      ? Section(
+                      ? Column(
-                          title: appLocalizations.backupAndRecovery,
+                          children: [
-                          child: Column(
+                            ListHeader(
-                            children: [
+                                title: appLocalizations.backupAndRecovery),
-                              ListItem(
+                            ListItem(
-                                onTab: _backup,
+                              onTap: _backup,
-                                title: Text(appLocalizations.backup),
+                              title: Text(appLocalizations.backup),
-                                subtitle: Text(appLocalizations.backupDesc),
+                              subtitle: Text(appLocalizations.backupDesc),
-                              ),
+                            ),
-                              ListItem(
+                            ListItem(
-                                onTab: _handleRecovery,
+                              onTap: _handleRecovery,
-                                title: Text(appLocalizations.recovery),
+                              title: Text(appLocalizations.recovery),
-                                subtitle: Text(appLocalizations.recoveryDesc),
+                              subtitle: Text(appLocalizations.recoveryDesc),
-                              ),
+                            ),
-                            ],
+                          ],
-                          ),
                         )
                       : Container(),
                 );
@@ -228,7 +219,6 @@ class _WebDAVFormDialogState extends State<WebDAVFormDialog> {
     Navigator.pop(context);
   }
 
-
   @override
   void dispose() {
     super.dispose();
@@ -350,13 +340,13 @@ class _RecoveryOptionsDialogState extends State<RecoveryOptionsDialog> {
         child: Wrap(
           children: [
             ListItem(
-              onTab: () {
+              onTap: () {
                 _handleOnTab(RecoveryOption.onlyProfiles);
               },
               title: Text(appLocalizations.recoveryProfiles),
             ),
             ListItem(
-              onTab: () {
+              onTap: () {
                 _handleOnTab(RecoveryOption.all);
               },
               title: Text(appLocalizations.recoveryAll),

lib/fragments/config.dart

@@ -137,335 +137,302 @@ class _ConfigFragmentState extends State<ConfigFragment> {
     }
   }
 
-  Widget _buildAppSection() {
+  List<Widget> _buildAppSection() {
-    final items = [
+    return generateSection(
-      if (Platform.isAndroid)
-        Selector<Config, bool>(
-          selector: (_, config) => config.allowBypass,
-          builder: (_, allowBypass, __) {
-            return ListItem.switchItem(
-              leading: const Icon(Icons.arrow_forward_outlined),
-              title: Text(appLocalizations.allowBypass),
-              subtitle: Text(appLocalizations.allowBypassDesc),
-              delegate: SwitchDelegate(
-                value: allowBypass,
-                onChanged: (bool value) async {
-                  final appController = globalState.appController;
-                  appController.config.allowBypass = value;
-                },
-              ),
-            );
-          },
-        ),
-      if (Platform.isAndroid)
-        Selector<Config, bool>(
-          selector: (_, config) => config.systemProxy,
-          builder: (_, systemProxy, __) {
-            return ListItem.switchItem(
-              leading: const Icon(Icons.settings_ethernet),
-              title: Text(appLocalizations.systemProxy),
-              subtitle: Text(appLocalizations.systemProxyDesc),
-              delegate: SwitchDelegate(
-                value: systemProxy,
-                onChanged: (bool value) async {
-                  final appController = globalState.appController;
-                  appController.config.systemProxy = value;
-                },
-              ),
-            );
-          },
-        ),
-      Selector<Config, bool>(
-        selector: (_, config) => config.isCompatible,
-        builder: (_, isCompatible, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.expand_outlined),
-            title: Text(appLocalizations.compatible),
-            subtitle: Text(appLocalizations.compatibleDesc),
-            delegate: SwitchDelegate(
-              value: isCompatible,
-              onChanged: (bool value) async {
-                final appController = globalState.appController;
-                appController.config.isCompatible = value;
-                await appController.applyProfile();
-              },
-            ),
-          );
-        },
-      ),
-    ];
-    return Section(
       title: appLocalizations.app,
-      child: Column(
+      items: [
-        children: [
+        if (Platform.isAndroid)
-          for (final item in items) ...[
+          Selector<Config, bool>(
-            item,
+            selector: (_, config) => config.allowBypass,
-            if (items.last != item)
+            builder: (_, allowBypass, __) {
-              const Divider(
+              return ListItem.switchItem(
-                height: 0,
+                leading: const Icon(Icons.arrow_forward_outlined),
-              )
+                title: Text(appLocalizations.allowBypass),
-          ]
+                subtitle: Text(appLocalizations.allowBypassDesc),
-        ],
+                delegate: SwitchDelegate(
-      ),
+                  value: allowBypass,
+                  onChanged: (bool value) async {
+                    final appController = globalState.appController;
+                    appController.config.allowBypass = value;
+                  },
+                ),
+              );
+            },
+          ),
+        if (Platform.isAndroid)
+          Selector<Config, bool>(
+            selector: (_, config) => config.systemProxy,
+            builder: (_, systemProxy, __) {
+              return ListItem.switchItem(
+                leading: const Icon(Icons.settings_ethernet),
+                title: Text(appLocalizations.systemProxy),
+                subtitle: Text(appLocalizations.systemProxyDesc),
+                delegate: SwitchDelegate(
+                  value: systemProxy,
+                  onChanged: (bool value) async {
+                    final appController = globalState.appController;
+                    appController.config.systemProxy = value;
+                  },
+                ),
+              );
+            },
+          ),
+        Selector<Config, bool>(
+          selector: (_, config) => config.isCompatible,
+          builder: (_, isCompatible, __) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.expand_outlined),
+              title: Text(appLocalizations.compatible),
+              subtitle: Text(appLocalizations.compatibleDesc),
+              delegate: SwitchDelegate(
+                value: isCompatible,
+                onChanged: (bool value) async {
+                  final appController = globalState.appController;
+                  appController.config.isCompatible = value;
+                  await appController.applyProfile();
+                },
+              ),
+            );
+          },
+        ),
+      ],
     );
   }
 
-  Widget _buildGeneralSection() {
+  List<Widget> _buildGeneralSection() {
-    final items = [
+    return generateSection(
-      Selector<ClashConfig, LogLevel>(
+      title: appLocalizations.general,
-        selector: (_, clashConfig) => clashConfig.logLevel,
+      items: [
-        builder: (_, value, __) {
+        Selector<ClashConfig, LogLevel>(
-          return ListItem(
+          selector: (_, clashConfig) => clashConfig.logLevel,
-            leading: const Icon(Icons.info_outline),
+          builder: (_, value, __) {
-            title: Text(appLocalizations.logLevel),
+            return ListItem(
-            subtitle: Text(value.name),
+              leading: const Icon(Icons.info_outline),
-            onTab: () {
+              title: Text(appLocalizations.logLevel),
-              _showLogLevelDialog(value);
+              subtitle: Text(value.name),
-            },
+              onTap: () {
-          );
+                _showLogLevelDialog(value);
-        },
+              },
-      ),
+            );
-      Selector<ClashConfig, String?>(
+          },
-        selector: (_, clashConfig) => clashConfig.globalRealUa,
+        ),
-        builder: (_, value, __) {
+        Selector<ClashConfig, String?>(
-          return ListItem(
+          selector: (_, clashConfig) => clashConfig.globalRealUa,
-            leading: const Icon(Icons.computer_outlined),
+          builder: (_, value, __) {
-            title: const Text("UA"),
+            return ListItem(
-            subtitle: Text(value ?? appLocalizations.defaultText),
+              leading: const Icon(Icons.computer_outlined),
-            onTab: () {
+              title: const Text("UA"),
-              _showUaDialog(value);
+              subtitle: Text(value ?? appLocalizations.defaultText),
-            },
+              onTap: () {
-          );
+                _showUaDialog(value);
-        },
+              },
-      ),
+            );
-      Selector<Config, String>(
+          },
-        selector: (_, config) => config.testUrl,
+        ),
-        builder: (_, value, __) {
+        Selector<Config, String>(
-          return ListItem(
+          selector: (_, config) => config.testUrl,
-            leading: const Icon(Icons.timeline),
+          builder: (_, value, __) {
-            title: Text(appLocalizations.testUrl),
+            return ListItem(
-            subtitle: Text(value),
+              leading: const Icon(Icons.timeline),
-            onTab: () {
+              title: Text(appLocalizations.testUrl),
-              _modifyTestUrl(value);
+              subtitle: Text(value),
-            },
+              onTap: () {
-          );
+                _modifyTestUrl(value);
-        },
+              },
-      ),
+            );
-      Selector<ClashConfig, int>(
+          },
-        selector: (_, clashConfig) => clashConfig.mixedPort,
+        ),
-        builder: (_, mixedPort, __) {
+        Selector<ClashConfig, int>(
-          return ListItem(
+          selector: (_, clashConfig) => clashConfig.mixedPort,
-            onTab: () {
+          builder: (_, mixedPort, __) {
-              _modifyMixedPort(mixedPort);
+            return ListItem(
-            },
+              onTap: () {
-            leading: const Icon(Icons.adjust_outlined),
-            title: Text(appLocalizations.proxyPort),
-            subtitle: Text(appLocalizations.proxyPortDesc),
-            trailing: FilledButton.tonal(
-              onPressed: () {
                 _modifyMixedPort(mixedPort);
               },
-              child: Text(
+              leading: const Icon(Icons.adjust_outlined),
-                "$mixedPort",
+              title: Text(appLocalizations.proxyPort),
+              subtitle: Text(appLocalizations.proxyPortDesc),
+              trailing: FilledButton.tonal(
+                onPressed: () {
+                  _modifyMixedPort(mixedPort);
+                },
+                child: Text(
+                  "$mixedPort",
+                ),
               ),
-            ),
+            );
-          );
+          },
-        },
+        ),
-      ),
-      Selector<ClashConfig, bool>(
-        selector: (_, clashConfig) => clashConfig.ipv6,
-        builder: (_, ipv6, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.water_outlined),
-            title: const Text("IPv6"),
-            subtitle: Text(appLocalizations.ipv6Desc),
-            delegate: SwitchDelegate(
-              value: ipv6,
-              onChanged: (bool value) async {
-                final appController = globalState.appController;
-                appController.clashConfig.ipv6 = value;
-                appController.updateClashConfigDebounce();
-              },
-            ),
-          );
-        },
-      ),
-      Selector<ClashConfig, bool>(
-        selector: (_, clashConfig) => clashConfig.allowLan,
-        builder: (_, allowLan, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.device_hub),
-            title: Text(appLocalizations.allowLan),
-            subtitle: Text(appLocalizations.allowLanDesc),
-            delegate: SwitchDelegate(
-              value: allowLan,
-              onChanged: (bool value) async {
-                final clashConfig = context.read<ClashConfig>();
-                clashConfig.allowLan = value;
-                globalState.appController.updateClashConfigDebounce();
-              },
-            ),
-          );
-        },
-      ),
-      Selector<ClashConfig, bool>(
-        selector: (_, clashConfig) => clashConfig.unifiedDelay,
-        builder: (_, unifiedDelay, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.compress_outlined),
-            title: Text(appLocalizations.unifiedDelay),
-            subtitle: Text(appLocalizations.unifiedDelayDesc),
-            delegate: SwitchDelegate(
-              value: unifiedDelay,
-              onChanged: (bool value) async {
-                final appController = globalState.appController;
-                appController.clashConfig.unifiedDelay = value;
-                appController.updateClashConfigDebounce();
-              },
-            ),
-          );
-        },
-      ),
-      Selector<ClashConfig, bool>(
-        selector: (_, clashConfig) =>
-            clashConfig.findProcessMode == FindProcessMode.always,
-        builder: (_, findProcess, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.polymer_outlined),
-            title: Text(appLocalizations.findProcessMode),
-            subtitle: Text(appLocalizations.findProcessModeDesc),
-            delegate: SwitchDelegate(
-              value: findProcess,
-              onChanged: (bool value) async {
-                final appController = globalState.appController;
-                appController.clashConfig.findProcessMode =
-                    value ? FindProcessMode.always : FindProcessMode.off;
-                appController.updateClashConfigDebounce();
-              },
-            ),
-          );
-        },
-      ),
-      Selector<ClashConfig, bool>(
-        selector: (_, clashConfig) => clashConfig.tcpConcurrent,
-        builder: (_, tcpConcurrent, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.double_arrow_outlined),
-            title: Text(appLocalizations.tcpConcurrent),
-            subtitle: Text(appLocalizations.tcpConcurrentDesc),
-            delegate: SwitchDelegate(
-              value: tcpConcurrent,
-              onChanged: (bool value) async {
-                final appController = globalState.appController;
-                appController.clashConfig.tcpConcurrent = value;
-                appController.updateClashConfigDebounce();
-              },
-            ),
-          );
-        },
-      ),
-      Selector<ClashConfig, bool>(
-        selector: (_, clashConfig) =>
-            clashConfig.geodataLoader == geodataLoaderMemconservative,
-        builder: (_, memconservative, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.memory),
-            title: Text(appLocalizations.geodataLoader),
-            subtitle: Text(appLocalizations.geodataLoaderDesc),
-            delegate: SwitchDelegate(
-              value: memconservative,
-              onChanged: (bool value) async {
-                final appController = globalState.appController;
-                appController.clashConfig.geodataLoader = value
-                    ? geodataLoaderMemconservative
-                    : geodataLoaderStandard;
-                appController.updateClashConfigDebounce();
-              },
-            ),
-          );
-        },
-      ),
-      Selector<ClashConfig, bool>(
-        selector: (_, clashConfig) => clashConfig.externalController.isNotEmpty,
-        builder: (_, hasExternalController, __) {
-          return ListItem.switchItem(
-            leading: const Icon(Icons.api_outlined),
-            title: Text(appLocalizations.externalController),
-            subtitle: Text(appLocalizations.externalControllerDesc),
-            delegate: SwitchDelegate(
-              value: hasExternalController,
-              onChanged: (bool value) async {
-                final appController = globalState.appController;
-                appController.clashConfig.externalController =
-                    value ? defaultExternalController : '';
-                appController.updateClashConfigDebounce();
-              },
-            ),
-          );
-        },
-      ),
-    ];
-    return Section(
-      title: appLocalizations.general,
-      child: Column(
-        children: [
-          for (final item in items) ...[
-            item,
-            if (items.last != item)
-              const Divider(
-                height: 0,
-              )
-          ]
-        ],
-      ),
-    );
-  }
-
-  Widget _buildMoreSection() {
-    final items = [
-      if (system.isDesktop)
         Selector<ClashConfig, bool>(
-          selector: (_, clashConfig) => clashConfig.tun.enable,
+          selector: (_, clashConfig) => clashConfig.ipv6,
-          builder: (_, tunEnable, __) {
+          builder: (_, ipv6, __) {
             return ListItem.switchItem(
-              leading: const Icon(Icons.important_devices_outlined),
+              leading: const Icon(Icons.water_outlined),
-              title: Text(appLocalizations.tun),
+              title: const Text("IPv6"),
-              subtitle: Text(appLocalizations.tunDesc),
+              subtitle: Text(appLocalizations.ipv6Desc),
               delegate: SwitchDelegate(
-                value: tunEnable,
+                value: ipv6,
+                onChanged: (bool value) async {
+                  final appController = globalState.appController;
+                  appController.clashConfig.ipv6 = value;
+                  appController.updateClashConfigDebounce();
+                },
+              ),
+            );
+          },
+        ),
+        Selector<ClashConfig, bool>(
+          selector: (_, clashConfig) => clashConfig.allowLan,
+          builder: (_, allowLan, __) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.device_hub),
+              title: Text(appLocalizations.allowLan),
+              subtitle: Text(appLocalizations.allowLanDesc),
+              delegate: SwitchDelegate(
+                value: allowLan,
                 onChanged: (bool value) async {
                   final clashConfig = context.read<ClashConfig>();
-                  clashConfig.tun = Tun(enable: value);
+                  clashConfig.allowLan = value;
                   globalState.appController.updateClashConfigDebounce();
                 },
               ),
             );
           },
         ),
-    ];
+        Selector<ClashConfig, bool>(
-    if (items.isEmpty) return Container();
+          selector: (_, clashConfig) => clashConfig.unifiedDelay,
-    return Section(
+          builder: (_, unifiedDelay, __) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.compress_outlined),
+              title: Text(appLocalizations.unifiedDelay),
+              subtitle: Text(appLocalizations.unifiedDelayDesc),
+              delegate: SwitchDelegate(
+                value: unifiedDelay,
+                onChanged: (bool value) async {
+                  final appController = globalState.appController;
+                  appController.clashConfig.unifiedDelay = value;
+                  appController.updateClashConfigDebounce();
+                },
+              ),
+            );
+          },
+        ),
+        Selector<ClashConfig, bool>(
+          selector: (_, clashConfig) =>
+              clashConfig.findProcessMode == FindProcessMode.always,
+          builder: (_, findProcess, __) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.polymer_outlined),
+              title: Text(appLocalizations.findProcessMode),
+              subtitle: Text(appLocalizations.findProcessModeDesc),
+              delegate: SwitchDelegate(
+                value: findProcess,
+                onChanged: (bool value) async {
+                  final appController = globalState.appController;
+                  appController.clashConfig.findProcessMode =
+                      value ? FindProcessMode.always : FindProcessMode.off;
+                  appController.updateClashConfigDebounce();
+                },
+              ),
+            );
+          },
+        ),
+        Selector<ClashConfig, bool>(
+          selector: (_, clashConfig) => clashConfig.tcpConcurrent,
+          builder: (_, tcpConcurrent, __) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.double_arrow_outlined),
+              title: Text(appLocalizations.tcpConcurrent),
+              subtitle: Text(appLocalizations.tcpConcurrentDesc),
+              delegate: SwitchDelegate(
+                value: tcpConcurrent,
+                onChanged: (bool value) async {
+                  final appController = globalState.appController;
+                  appController.clashConfig.tcpConcurrent = value;
+                  appController.updateClashConfigDebounce();
+                },
+              ),
+            );
+          },
+        ),
+        Selector<ClashConfig, bool>(
+          selector: (_, clashConfig) =>
+              clashConfig.geodataLoader == geodataLoaderMemconservative,
+          builder: (_, memconservative, __) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.memory),
+              title: Text(appLocalizations.geodataLoader),
+              subtitle: Text(appLocalizations.geodataLoaderDesc),
+              delegate: SwitchDelegate(
+                value: memconservative,
+                onChanged: (bool value) async {
+                  final appController = globalState.appController;
+                  appController.clashConfig.geodataLoader = value
+                      ? geodataLoaderMemconservative
+                      : geodataLoaderStandard;
+                  appController.updateClashConfigDebounce();
+                },
+              ),
+            );
+          },
+        ),
+        Selector<ClashConfig, bool>(
+          selector: (_, clashConfig) =>
+              clashConfig.externalController.isNotEmpty,
+          builder: (_, hasExternalController, __) {
+            return ListItem.switchItem(
+              leading: const Icon(Icons.api_outlined),
+              title: Text(appLocalizations.externalController),
+              subtitle: Text(appLocalizations.externalControllerDesc),
+              delegate: SwitchDelegate(
+                value: hasExternalController,
+                onChanged: (bool value) async {
+                  final appController = globalState.appController;
+                  appController.clashConfig.externalController =
+                      value ? defaultExternalController : '';
+                  appController.updateClashConfigDebounce();
+                },
+              ),
+            );
+          },
+        ),
+      ],
+    );
+  }
+
+  List<Widget> _buildMoreSection() {
+    return generateSection(
       title: appLocalizations.more,
-      child: Column(
+      items: [
-        children: [
+        if (system.isDesktop)
-          for (final item in items) ...[
+          Selector<ClashConfig, bool>(
-            item,
+            selector: (_, clashConfig) => clashConfig.tun.enable,
-            if (items.last != item)
+            builder: (_, tunEnable, __) {
-              const Divider(
+              return ListItem.switchItem(
-                height: 0,
+                leading: const Icon(Icons.important_devices_outlined),
-              )
+                title: Text(appLocalizations.tun),
-          ]
+                subtitle: Text(appLocalizations.tunDesc),
-        ],
+                delegate: SwitchDelegate(
-      ),
+                  value: tunEnable,
+                  onChanged: (bool value) async {
+                    final clashConfig = context.read<ClashConfig>();
+                    clashConfig.tun = Tun(enable: value);
+                    globalState.appController.updateClashConfigDebounce();
+                  },
+                ),
+              );
+            },
+          ),
+      ],
     );
   }
 
   @override
   Widget build(BuildContext context) {
     List<Widget> items = [
-      _buildAppSection(),
+      ..._buildAppSection(),
-      _buildGeneralSection(),
+      ..._buildGeneralSection(),
-      _buildMoreSection(),
+      ..._buildMoreSection(),
     ];
     return ListView.builder(
       padding: const EdgeInsets.only(bottom: 32),

lib/fragments/connections.dart

@@ -1,11 +1,9 @@
 import 'dart:async';
-import 'dart:io';
 
 import 'package:fl_clash/clash/clash.dart';
 import 'package:fl_clash/common/common.dart';
 import 'package:fl_clash/enum/enum.dart';
 import 'package:fl_clash/models/models.dart';
-import 'package:fl_clash/plugins/app.dart';
 import 'package:fl_clash/widgets/widgets.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
@@ -63,9 +61,6 @@ class _ConnectionsFragmentState extends State<ConnectionsFragment> {
             },
             icon: const Icon(Icons.search),
           ),
-          const SizedBox(
-            width: 8,
-          )
         ];
       },
     );
@@ -139,8 +134,8 @@ class _ConnectionsFragmentState extends State<ConnectionsFragment> {
                     vertical: 16,
                   ),
                   child: Wrap(
-                    runSpacing: 8,
+                    runSpacing: 6,
-                    spacing: 8,
+                    spacing: 6,
                     children: [
                       for (final keyword in state.keywords)
                         CommonChip(
@@ -162,7 +157,12 @@ class _ConnectionsFragmentState extends State<ConnectionsFragment> {
                       key: Key(connection.id),
                       connection: connection,
                       onClick: _addKeyword,
-                      onBlock: _handleBlockConnection,
+                      trailing: IconButton(
+                        icon: const Icon(Icons.block),
+                        onPressed: () {
+                          _handleBlockConnection(connection.id);
+                        },
+                      ),
                     );
                   },
                   separatorBuilder: (BuildContext context, int index) {
@@ -181,112 +181,6 @@ class _ConnectionsFragmentState extends State<ConnectionsFragment> {
   }
 }
 
-class ConnectionItem extends StatelessWidget {
-  final Connection connection;
-  final Function(String)? onClick;
-  final Function(String)? onBlock;
-
-  const ConnectionItem({
-    super.key,
-    required this.connection,
-    this.onClick,
-    this.onBlock,
-  });
-
-  Future<ImageProvider?> _getPackageIcon(Connection connection) async {
-    return await app?.getPackageIcon(connection.metadata.process);
-  }
-
-  String _getRequestText(Metadata metadata) {
-    var text = "${metadata.network}://";
-    final ips = [
-      metadata.host,
-      metadata.destinationIP,
-    ].where((ip) => ip.isNotEmpty);
-    text += ips.join("/");
-    text += ":${metadata.destinationPort}";
-    return text;
-  }
-
-  String _getSourceText(Connection connection) {
-    final metadata = connection.metadata;
-    if (metadata.process.isEmpty) {
-      return connection.start.lastUpdateTimeDesc;
-    }
-    return "${metadata.process} · ${connection.start.lastUpdateTimeDesc}";
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return ListItem(
-      tileTitleAlignment: ListTileTitleAlignment.titleHeight,
-      leading: Platform.isAndroid
-          ? Container(
-              margin: const EdgeInsets.only(top: 4),
-              width: 48,
-              height: 48,
-              child: FutureBuilder<ImageProvider?>(
-                future: _getPackageIcon(connection),
-                builder: (_, snapshot) {
-                  if (!snapshot.hasData && snapshot.data == null) {
-                    return Container();
-                  } else {
-                    return Image(
-                      image: snapshot.data!,
-                      gaplessPlayback: true,
-                      width: 48,
-                      height: 48,
-                    );
-                  }
-                },
-              ),
-            )
-          : null,
-      title: Text(
-        _getRequestText(connection.metadata),
-      ),
-      subtitle: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          const SizedBox(
-            height: 12,
-          ),
-          Text(
-            _getSourceText(connection),
-          ),
-          const SizedBox(
-            height: 12,
-          ),
-          Wrap(
-            runSpacing: 8,
-            spacing: 8,
-            children: [
-              for (final chain in connection.chains)
-                CommonChip(
-                  label: chain,
-                  onPressed: () {
-                    if (onClick == null) return;
-                    onClick!(chain);
-                  },
-                ),
-            ],
-          ),
-          const SizedBox(
-            height: 12,
-          ),
-        ],
-      ),
-      trailing: IconButton(
-        icon: const Icon(Icons.block),
-        onPressed: () {
-          if (onBlock == null) return;
-          onBlock!(connection.id);
-        },
-      ),
-    );
-  }
-}
-
 class ConnectionsSearchDelegate extends SearchDelegate {
   ValueNotifier<ConnectionsAndKeywords> connectionsNotifier;
 
@@ -332,11 +226,11 @@ class ConnectionsSearchDelegate extends SearchDelegate {
     );
   }
 
-
   _handleBlockConnection(String id) {
     clashCore.closeConnections(id);
-    connectionsNotifier.value = connectionsNotifier.value
+    connectionsNotifier.value = connectionsNotifier.value.copyWith(
-        .copyWith(connections: clashCore.getConnections());
+      connections: clashCore.getConnections(),
+    );
   }
 
   @override
@@ -394,8 +288,8 @@ class ConnectionsSearchDelegate extends SearchDelegate {
                   vertical: 16,
                 ),
                 child: Wrap(
-                  runSpacing: 8,
+                  runSpacing: 6,
-                  spacing: 8,
+                  spacing: 6,
                   children: [
                     for (final keyword in state.keywords)
                       CommonChip(
@@ -416,7 +310,12 @@ class ConnectionsSearchDelegate extends SearchDelegate {
                     key: Key(connection.id),
                     connection: connection,
                     onClick: _addKeyword,
-                    onBlock: _handleBlockConnection,
+                    trailing: IconButton(
+                      icon: const Icon(Icons.block),
+                      onPressed: () {
+                        _handleBlockConnection(connection.id);
+                      },
+                    ),
                   );
                 },
                 separatorBuilder: (BuildContext context, int index) {

lib/fragments/dashboard/dashboard.dart

@@ -1,10 +1,10 @@
-import 'package:fl_clash/enum/enum.dart';
+import 'dart:math';
+
 import 'package:fl_clash/fragments/dashboard/intranet_ip.dart';
 import 'package:fl_clash/models/models.dart';
 import 'package:flutter/material.dart';
 import 'package:fl_clash/widgets/widgets.dart';
 import 'package:provider/provider.dart';
-
 import 'network_detection.dart';
 import 'outbound_mode.dart';
 import 'start_button.dart';
@@ -29,34 +29,35 @@ class _DashboardFragmentState extends State<DashboardFragment> {
         alignment: Alignment.topCenter,
         child: SingleChildScrollView(
           padding: const EdgeInsets.all(16),
-          child: Selector<AppState, ViewMode>(
+          child: Selector<AppState, double>(
-            selector: (_, appState) => appState.viewMode,
+            selector: (_, appState) => appState.viewWidth,
-            builder: (_, viewMode, ___) {
+            builder: (_, viewWidth, ___) {
-              final isDesktop = viewMode == ViewMode.desktop;
+              // final viewMode = other.getViewMode(viewWidth);
+              // final isDesktop = viewMode == ViewMode.desktop;
               return Grid(
-                crossAxisCount: 12,
+                crossAxisCount: max(4 * ((viewWidth / 320).ceil()), 8),
                 crossAxisSpacing: 16,
                 mainAxisSpacing: 16,
-                children: [
+                children: const [
                   GridItem(
-                    crossAxisCellCount: isDesktop ? 8 : 12,
+                    crossAxisCellCount: 8,
-                    child: const NetworkSpeed(),
+                    child: NetworkSpeed(),
                   ),
                   GridItem(
-                    crossAxisCellCount: isDesktop ? 4 : 6,
+                    crossAxisCellCount: 4,
-                    child: const OutboundMode(),
+                    child: OutboundMode(),
                   ),
                   GridItem(
-                    crossAxisCellCount: isDesktop ? 4 : 6,
+                    crossAxisCellCount: 4,
-                    child: const NetworkDetection(),
+                    child: NetworkDetection(),
                   ),
                   GridItem(
-                    crossAxisCellCount: isDesktop ? 4 : 6,
+                    crossAxisCellCount: 4,
-                    child: const TrafficUsage(),
+                    child: TrafficUsage(),
                   ),
                   GridItem(
-                    crossAxisCellCount: isDesktop ? 4 : 6,
+                    crossAxisCellCount: 4,
-                    child: const IntranetIP(),
+                    child: IntranetIP(),
                   ),
                 ],
               );

lib/fragments/dashboard/outbound_mode.dart

@@ -16,6 +16,7 @@ class OutboundMode extends StatelessWidget {
     if (value == null || clashConfig.mode == value) return;
     clashConfig.mode = value;
     await appController.updateClashConfig();
+    appController.addCheckIpNumDebounce();
   }
 
   @override

lib/fragments/fragments.dart

@@ -1,4 +1,4 @@
-export 'proxies.dart';
+export 'proxies/proxies.dart';
 export 'dashboard/dashboard.dart';
 export 'tools.dart';
 export 'profiles/profiles.dart';

lib/fragments/logs.dart

@@ -72,9 +72,6 @@ class _LogsFragmentState extends State<LogsFragment> {
           },
           icon: const Icon(Icons.search),
         ),
-        const SizedBox(
-          width: 8,
-        )
       ];
     });
   }
@@ -269,8 +266,8 @@ class LogsSearchDelegate extends SearchDelegate {
                   vertical: 16,
                 ),
                 child: Wrap(
-                  runSpacing: 8,
+                  runSpacing: 6,
-                  spacing: 8,
+                  spacing: 6,
                   children: [
                     for (final keyword in state.keywords)
                       CommonChip(
@@ -328,26 +325,23 @@ class _LogItemState extends State<LogItem> {
   @override
   Widget build(BuildContext context) {
     final log = widget.log;
-    return ListTile(
+    return ListItem(
+      padding: const EdgeInsets.symmetric(
+        horizontal: 16,
+        vertical: 4,
+      ),
       title: SelectableText(log.payload ?? ''),
       subtitle: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
-          Padding(
+          SelectableText(
-            padding: const EdgeInsets.only(
+            "${log.dateTime}",
-              top: 8,
+            style: context.textTheme.bodySmall
-            ),
+                ?.copyWith(color: context.colorScheme.primary),
-            child: SelectableText(
-              "${log.dateTime}",
-              style: context.textTheme.bodySmall
-                  ?.copyWith(color: context.colorScheme.primary),
-            ),
           ),
+          const SizedBox(height: 8,),
           Container(
             alignment: Alignment.centerLeft,
-            padding: const EdgeInsets.symmetric(
-              vertical: 8,
-            ),
             child: CommonChip(
               onPressed: () {
                 if (widget.onClick == null) return;

lib/fragments/profiles/add_profile.dart

@@ -48,19 +48,19 @@ class AddProfile extends StatelessWidget {
             leading: const Icon(Icons.qr_code),
             title: Text(appLocalizations.qrcode),
             subtitle: Text(appLocalizations.qrcodeDesc),
-            onTab: _toScan,
+            onTap: _toScan,
           ),
         ListItem(
           leading: const Icon(Icons.upload_file),
           title: Text(appLocalizations.file),
           subtitle: Text(appLocalizations.fileDesc),
-          onTab: _handleAddProfileFormFile,
+          onTap: _handleAddProfileFormFile,
         ),
         ListItem(
           leading: const Icon(Icons.cloud_download),
           title: Text(appLocalizations.url),
           subtitle: Text(appLocalizations.urlDesc),
-          onTab: _toAdd,
+          onTap: _toAdd,
         )
       ],
     );

lib/fragments/profiles/profiles.dart

@@ -3,7 +3,6 @@ import 'package:fl_clash/fragments/profiles/edit_profile.dart';
 import 'package:fl_clash/fragments/profiles/view_profile.dart';
 import 'package:fl_clash/models/models.dart';
 import 'package:fl_clash/common/common.dart';
-import 'package:fl_clash/plugins/app.dart';
 import 'package:fl_clash/state.dart';
 import 'package:fl_clash/widgets/widgets.dart';
 import 'package:flutter/material.dart';
@@ -73,17 +72,7 @@ class _ProfilesFragmentState extends State<ProfilesFragment> {
             },
             icon: const Icon(Icons.sync),
           ),
-          const SizedBox(
-            width: 8,
-          )
         ];
-        commonScaffoldState?.floatingActionButton = FloatingActionButton(
-          heroTag: null,
-          onPressed: _handleShowAddExtendPage,
-          child: const Icon(
-            Icons.add,
-          ),
-        );
       },
     );
   }
@@ -114,77 +103,82 @@ class _ProfilesFragmentState extends State<ProfilesFragment> {
 
   @override
   Widget build(BuildContext context) {
-    return Selector<AppState, bool>(
+    return FloatLayout(
-      selector: (_, appState) => appState.currentLabel == 'profiles',
+      floatingWidget: FloatWrapper(
-      builder: (_, isCurrent, child) {
+        child: FloatingActionButton(
-        if (isCurrent) {
+          heroTag: null,
-          _initScaffoldState();
+          onPressed: _handleShowAddExtendPage,
-        }
+          child: const Icon(
-        return child!;
+            Icons.add,
-      },
+          ),
-      child: Selector2<AppState, Config, ProfilesSelectorState>(
-        selector: (_, appState, config) => ProfilesSelectorState(
-          profiles: config.profiles,
-          currentProfileId: config.currentProfileId,
-          viewMode: appState.viewMode,
         ),
-        builder: (context, state, child) {
+      ),
-          if (state.profiles.isEmpty) {
+      child: Selector<AppState, bool>(
-            return NullStatus(
+        selector: (_, appState) => appState.currentLabel == 'profiles',
-              label: appLocalizations.nullProfileDesc,
+        builder: (_, isCurrent, child) {
-            );
+          if (isCurrent) {
+            _initScaffoldState();
           }
-          profileItemKeys = state.profiles
+          return child!;
-              .map((profile) => GlobalObjectKey<_ProfileItemState>(profile.id))
+        },
-              .toList();
+        child: Selector2<AppState, Config, ProfilesSelectorState>(
-          final columns = _getColumns(state.viewMode);
+          selector: (_, appState, config) => ProfilesSelectorState(
-          final isMobile = state.viewMode == ViewMode.mobile;
+            profiles: config.profiles,
-          return Align(
+            currentProfileId: config.currentProfileId,
-            alignment: Alignment.topCenter,
+            viewMode: appState.viewMode,
-            child: NotificationListener<ScrollNotification>(
+          ),
-              onNotification: (scrollNotification) {
+          builder: (context, state, child) {
-                WidgetsBinding.instance.addPostFrameCallback((_) {
+            if (state.profiles.isEmpty) {
+              return NullStatus(
+                label: appLocalizations.nullProfileDesc,
+              );
+            }
+            profileItemKeys = state.profiles
+                .map(
+                    (profile) => GlobalObjectKey<_ProfileItemState>(profile.id))
+                .toList();
+            final columns = _getColumns(state.viewMode);
+            return Align(
+              alignment: Alignment.topCenter,
+              child: NotificationListener<ScrollNotification>(
+                onNotification: (scrollNotification) {
                   hasPadding.value =
                       scrollNotification.metrics.maxScrollExtent > 0;
-                });
+                  return true;
-                return true;
-              },
-              child: ValueListenableBuilder(
-                valueListenable: hasPadding,
-                builder: (_, hasPadding, __) {
-                  return SingleChildScrollView(
-                    padding: !isMobile
-                        ? EdgeInsets.only(
-                            left: 16,
-                            right: 16,
-                            top: 16,
-                            bottom: 16 + (hasPadding ? 56 : 0),
-                          )
-                        : EdgeInsets.only(
-                            bottom: 0 + (hasPadding ? 56 : 0),
-                          ),
-                    child: Grid(
-                      mainAxisSpacing: isMobile ? 8 : 16,
-                      crossAxisSpacing: 16,
-                      crossAxisCount: columns,
-                      children: [
-                        for (int i = 0; i < state.profiles.length; i++)
-                          GridItem(
-                            child: ProfileItem(
-                              key: profileItemKeys[i],
-                              profile: state.profiles[i],
-                              groupValue: state.currentProfileId,
-                              onChanged: _changeProfile,
-                            ),
-                          ),
-                      ],
-                    ),
-                  );
                 },
+                child: ValueListenableBuilder(
+                  valueListenable: hasPadding,
+                  builder: (_, hasPadding, __) {
+                    return SingleChildScrollView(
+                      padding: EdgeInsets.only(
+                        left: 16,
+                        right: 16,
+                        top: 16,
+                        bottom: 16 + (hasPadding ? 72 : 0),
+                      ),
+                      child: Grid(
+                        mainAxisSpacing: 16,
+                        crossAxisSpacing: 16,
+                        crossAxisCount: columns,
+                        children: [
+                          for (int i = 0; i < state.profiles.length; i++)
+                            GridItem(
+                              child: ProfileItem(
+                                key: profileItemKeys[i],
+                                profile: state.profiles[i],
+                                groupValue: state.currentProfileId,
+                                onChanged: _changeProfile,
+                              ),
+                            ),
+                        ],
+                      ),
+                    );
+                  },
+                ),
               ),
-            ),
+            );
-          );
+          },
-        },
+        ),
       ),
     );
   }
@@ -220,11 +214,18 @@ class _ProfileItemState extends State<ProfileItem> {
   Future updateProfile([isSingle = true]) async {
     isUpdating.value = true;
     try {
-      await globalState.appController.updateProfile(widget.profile);
+      final appController = globalState.appController;
+      await appController.updateProfile(widget.profile);
+      if (widget.profile.id == appController.config.currentProfile?.id &&
+          !appController.appState.isStart) {
+        globalState.appController.rawApplyProfile();
+      }
     } catch (e) {
       isUpdating.value = false;
       if (!isSingle) {
         return e.toString();
+      } else {
+        rethrow;
       }
     }
     isUpdating.value = false;
@@ -264,11 +265,13 @@ class _ProfileItemState extends State<ProfileItem> {
             mainAxisSize: MainAxisSize.max,
             mainAxisAlignment: MainAxisAlignment.spaceBetween,
             children: [
-              Text(
+              Flexible(
-                profile.label ?? profile.id,
+                child: Text(
-                style: textTheme.titleMedium,
+                  profile.label ?? profile.id,
-                maxLines: 1,
+                  style: textTheme.titleMedium,
-                overflow: TextOverflow.ellipsis,
+                  maxLines: 1,
+                  overflow: TextOverflow.ellipsis,
+                ),
               ),
               Text(
                 profile.lastUpdateDate?.lastUpdateTimeDesc ?? '',
@@ -412,16 +415,7 @@ class _ProfileItemState extends State<ProfileItem> {
     final profile = widget.profile;
     final groupValue = widget.groupValue;
     final onChanged = widget.onChanged;
-    return Selector<AppState, ViewMode>(
+    return CommonCard(
-      selector: (_, appState) => appState.viewMode,
-      builder: (_, viewMode, child) {
-        if (viewMode == ViewMode.mobile) {
-          return child!;
-        }
-        return CommonCard(
-          child: child!,
-        );
-      },
       child: ListItem.radio(
         key: Key(profile.id),
         horizontalTitleGap: 16,

lib/fragments/proxies.dart

@@ -1,918 +0,0 @@
-import 'dart:io';
-import 'dart:math';
-
-import 'package:collection/collection.dart';
-import 'package:fl_clash/clash/core.dart';
-import 'package:fl_clash/common/common.dart';
-import 'package:fl_clash/enum/enum.dart';
-import 'package:fl_clash/models/models.dart';
-import 'package:fl_clash/state.dart';
-import 'package:fl_clash/widgets/widgets.dart';
-import 'package:flutter/material.dart';
-import 'package:provider/provider.dart';
-
-class ProxiesFragment extends StatefulWidget {
-  const ProxiesFragment({super.key});
-
-  @override
-  State<ProxiesFragment> createState() => _ProxiesFragmentState();
-}
-
-class _ProxiesFragmentState extends State<ProxiesFragment> {
-  _initActions() {
-    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
-      final commonScaffoldState =
-          context.findAncestorStateOfType<CommonScaffoldState>();
-      final items = [
-        CommonPopupMenuItem(
-          action: ProxiesSortType.none,
-          label: appLocalizations.defaultSort,
-          iconData: Icons.reorder,
-        ),
-        CommonPopupMenuItem(
-          action: ProxiesSortType.delay,
-          label: appLocalizations.delaySort,
-          iconData: Icons.network_ping,
-        ),
-        CommonPopupMenuItem(
-          action: ProxiesSortType.name,
-          label: appLocalizations.nameSort,
-          iconData: Icons.sort_by_alpha,
-        ),
-      ];
-      commonScaffoldState?.actions = [
-        Selector<Config, ProxiesType>(
-          selector: (_, config) => config.proxiesType,
-          builder: (_, proxiesType, __) {
-            return IconButton(
-              icon: Icon(
-                switch (proxiesType) {
-                  ProxiesType.tab => Icons.view_list,
-                  ProxiesType.expansion => Icons.view_carousel,
-                },
-              ),
-              onPressed: () {
-                final config = globalState.appController.config;
-                config.proxiesType = config.proxiesType == ProxiesType.tab
-                    ? ProxiesType.expansion
-                    : ProxiesType.tab;
-              },
-            );
-          },
-        ),
-        IconButton(
-          icon: const Icon(
-            Icons.view_column,
-          ),
-          onPressed: () {
-            globalState.appController.changeColumns();
-          },
-        ),
-        IconButton(
-          icon: const Icon(Icons.transform_sharp),
-          onPressed: () {
-            final config = globalState.appController.config;
-            config.proxyCardType = config.proxyCardType == ProxyCardType.expand
-                ? ProxyCardType.shrink
-                : ProxyCardType.expand;
-          },
-        ),
-        Selector<Config, ProxiesSortType>(
-          selector: (_, config) => config.proxiesSortType,
-          builder: (_, proxiesSortType, __) {
-            return CommonPopupMenu<ProxiesSortType>.radio(
-              items: items,
-              icon: const Icon(Icons.sort_sharp),
-              onSelected: (value) {
-                final config = context.read<Config>();
-                config.proxiesSortType = value;
-              },
-              selectedValue: proxiesSortType,
-            );
-          },
-        ),
-        const SizedBox(
-          width: 8,
-        )
-      ];
-    });
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Selector<AppState, bool>(
-      selector: (_, appState) => appState.currentLabel == 'proxies',
-      builder: (_, isCurrent, child) {
-        if (isCurrent) {
-          _initActions();
-        }
-        return child!;
-      },
-      child: Selector<Config, ProxiesType>(
-        selector: (_, config) => config.proxiesType,
-        builder: (_, proxiesType, __) {
-          return switch (proxiesType) {
-            ProxiesType.tab => const ProxiesTabFragment(),
-            ProxiesType.expansion => const ProxiesExpansionPanelFragment(),
-          };
-        },
-      ),
-    );
-  }
-}
-
-class ProxiesTabFragment extends StatefulWidget {
-  const ProxiesTabFragment({super.key});
-
-  @override
-  State<ProxiesTabFragment> createState() => _ProxiesTabFragmentState();
-}
-
-class _ProxiesTabFragmentState extends State<ProxiesTabFragment>
-    with TickerProviderStateMixin {
-  TabController? _tabController;
-
-  _handleTabControllerChange() {
-    final indexIsChanging = _tabController?.indexIsChanging ?? false;
-    if (indexIsChanging) return;
-    final index = _tabController?.index;
-    if (index == null) return;
-    final appController = globalState.appController;
-    final currentGroups = appController.appState.currentGroups;
-    if (currentGroups.length > index) {
-      appController.config.updateCurrentGroupName(currentGroups[index].name);
-    }
-  }
-
-  @override
-  void dispose() {
-    super.dispose();
-    _tabController?.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Selector2<AppState, Config, ProxiesSelectorState>(
-      selector: (_, appState, config) {
-        final currentGroups = appState.currentGroups;
-        final groupNames = currentGroups.map((e) => e.name).toList();
-        return ProxiesSelectorState(
-          groupNames: groupNames,
-          currentGroupName: config.currentGroupName,
-        );
-      },
-      shouldRebuild: (prev, next) {
-        if (!const ListEquality<String>()
-            .equals(prev.groupNames, next.groupNames)) {
-          _tabController?.removeListener(_handleTabControllerChange);
-          _tabController?.dispose();
-          _tabController = null;
-          return true;
-        }
-        return false;
-      },
-      builder: (_, state, __) {
-        final index = state.groupNames.indexWhere(
-          (item) => item == state.currentGroupName,
-        );
-        _tabController ??= TabController(
-          length: state.groupNames.length,
-          initialIndex: index == -1 ? 0 : index,
-          vsync: this,
-        )..addListener(_handleTabControllerChange);
-        return Column(
-          mainAxisAlignment: MainAxisAlignment.start,
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            TabBar(
-              controller: _tabController,
-              padding: const EdgeInsets.symmetric(horizontal: 16),
-              dividerColor: Colors.transparent,
-              isScrollable: true,
-              tabAlignment: TabAlignment.start,
-              overlayColor: const WidgetStatePropertyAll(Colors.transparent),
-              tabs: [
-                for (final groupName in state.groupNames)
-                  Tab(
-                    text: groupName,
-                  ),
-              ],
-            ),
-            Expanded(
-              child: TabBarView(
-                controller: _tabController,
-                children: [
-                  for (final groupName in state.groupNames)
-                    KeepContainer(
-                      key: ObjectKey(groupName),
-                      child: ProxyGroupView(
-                        groupName: groupName,
-                        type: ProxiesType.tab,
-                      ),
-                    ),
-                ],
-              ),
-            )
-          ],
-        );
-      },
-    );
-  }
-}
-
-class ProxiesExpansionPanelFragment extends StatefulWidget {
-  const ProxiesExpansionPanelFragment({super.key});
-
-  @override
-  State<ProxiesExpansionPanelFragment> createState() =>
-      _ProxiesExpansionPanelFragmentState();
-}
-
-class _ProxiesExpansionPanelFragmentState
-    extends State<ProxiesExpansionPanelFragment> {
-  @override
-  Widget build(BuildContext context) {
-    return Selector2<AppState, Config, ProxiesSelectorState>(
-      selector: (_, appState, config) {
-        final currentGroups = appState.currentGroups;
-        final groupNames = currentGroups.map((e) => e.name).toList();
-        return ProxiesSelectorState(
-          groupNames: groupNames,
-          currentGroupName: config.currentGroupName,
-        );
-      },
-      builder: (_, state, __) {
-        return ListView.separated(
-          padding: const EdgeInsets.all(16),
-          itemCount: state.groupNames.length,
-          itemBuilder: (_, index) {
-            final groupName = state.groupNames[index];
-            return ProxyGroupView(
-              key: PageStorageKey(groupName),
-              groupName: groupName,
-              type: ProxiesType.expansion,
-            );
-          },
-          separatorBuilder: (BuildContext context, int index) {
-            return const SizedBox(
-              height: 16,
-            );
-          },
-        );
-      },
-    );
-  }
-}
-
-class ProxyGroupView extends StatefulWidget {
-  final String groupName;
-  final ProxiesType type;
-
-  const ProxyGroupView({
-    super.key,
-    required this.groupName,
-    required this.type,
-  });
-
-  @override
-  State<ProxyGroupView> createState() => _ProxyGroupViewState();
-}
-
-class _ProxyGroupViewState extends State<ProxyGroupView> {
-  var isLock = false;
-  final isBoundaryNotifier = ValueNotifier<bool>(false);
-  final scrollController = ScrollController();
-  var isEnd = false;
-
-  String get groupName => widget.groupName;
-
-  ProxiesType get type => widget.type;
-
-  double _getItemHeight(ProxyCardType proxyCardType) {
-    final isExpand = proxyCardType == ProxyCardType.expand;
-    final measure = globalState.appController.measure;
-    final baseHeight =
-        12 * 2 + measure.bodyMediumHeight * 2 + measure.bodySmallHeight + 8;
-    return isExpand ? baseHeight + measure.labelSmallHeight + 8 : baseHeight;
-  }
-
-  _delayTest(List<Proxy> proxies) async {
-    if (isLock) return;
-    isLock = true;
-    final appController = globalState.appController;
-    for (final proxy in proxies) {
-      final proxyName =
-          appController.appState.getRealProxyName(proxy.name) ?? proxy.name;
-      globalState.appController.setDelay(
-        Delay(
-          name: proxyName,
-          value: 0,
-        ),
-      );
-      clashCore.getDelay(proxyName).then((delay) {
-        globalState.appController.setDelay(delay);
-      });
-    }
-    await Future.delayed(httpTimeoutDuration + moreDuration);
-    appController.appState.sortNum++;
-    isLock = false;
-  }
-
-  Widget _currentProxyNameBuilder({
-    required Widget Function(String) builder,
-  }) {
-    return Selector2<AppState, Config, String>(
-      selector: (_, appState, config) {
-        final group = appState.getGroupWithName(groupName)!;
-        return config.currentSelectedMap[groupName] ?? group.now ?? '';
-      },
-      builder: (_, value, ___) {
-        return builder(value);
-      },
-    );
-  }
-
-  Widget _buildTabGroupView({
-    required List<Proxy> proxies,
-    required int columns,
-    required ProxyCardType proxyCardType,
-  }) {
-    final sortedProxies = globalState.appController.getSortProxies(
-      proxies,
-    );
-    return DelayTestButtonContainer(
-      onClick: () async {
-        await _delayTest(
-          proxies,
-        );
-      },
-      child: Align(
-        alignment: Alignment.topCenter,
-        child: GridView.builder(
-          padding: const EdgeInsets.all(16),
-          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-            crossAxisCount: columns,
-            mainAxisSpacing: 8,
-            crossAxisSpacing: 8,
-            mainAxisExtent: _getItemHeight(proxyCardType),
-          ),
-          itemCount: sortedProxies.length,
-          itemBuilder: (_, index) {
-            final proxy = sortedProxies[index];
-            return _currentProxyNameBuilder(builder: (value) {
-              return ProxyCard(
-                type: proxyCardType,
-                key: ValueKey('$groupName.${proxy.name}'),
-                isSelected: value == proxy.name,
-                proxy: proxy,
-                groupName: groupName,
-              );
-            });
-          },
-        ),
-      ),
-    );
-  }
-
-  Widget _androidExpansionHandle(Widget child) {
-    // return NotificationListener<ScrollNotification>(
-    //   onNotification: (ScrollNotification notification) {
-    //     if (notification is ScrollEndNotification) {
-    //       if (notification.metrics.atEdge) {
-    //         isEnd = notification.metrics.pixels ==
-    //             notification.metrics.maxScrollExtent;
-    //         isBoundaryNotifier.value = true;
-    //       }
-    //     }
-    //     return false;
-    //   },
-    //   child: Listener(
-    //     onPointerMove: (details) {
-    //       double yOffset = details.delta.dy;
-    //       final isEnd = scrollController.position.maxScrollExtent == scrollController.position.pixels;
-    //       final isTop = scrollController.position.minScrollExtent == scrollController.position.pixels;
-    //       if(isEnd || isTop){
-    //         isBoundaryNotifier.value = true;
-    //       } else if (yOffset > 0 && scrollController.position.maxScrollExtent == scrollController.position.pixels) {
-    //         isBoundaryNotifier.value = false;
-    //       } else if (yOffset < 0 && !isEnd) {
-    //         isBoundaryNotifier.value = false;
-    //       }
-    //     },
-    //     child: child,
-    //   ),
-    // );
-    return Listener(
-      onPointerMove: (details) {
-        double yOffset = details.delta.dy;
-        final isEnd = scrollController.position.maxScrollExtent ==
-            scrollController.position.pixels;
-        final isTop = scrollController.position.minScrollExtent ==
-            scrollController.position.pixels;
-        if (isEnd && yOffset < 0) {
-          isBoundaryNotifier.value = true;
-        } else if (isTop && yOffset > 0) {
-          isBoundaryNotifier.value = true;
-        } else {
-          isBoundaryNotifier.value = false;
-        }
-      },
-      child: child,
-    );
-  }
-
-  Widget _buildExpansionGroupView({
-    required List<Proxy> proxies,
-    required int columns,
-    required ProxyCardType proxyCardType,
-  }) {
-    final sortedProxies = globalState.appController.getSortProxies(
-      proxies,
-    );
-    final group =
-        globalState.appController.appState.getGroupWithName(groupName)!;
-    final itemHeight = _getItemHeight(proxyCardType);
-    final innerHeight = context.appSize.height - 200;
-    final lines = (sortedProxies.length / columns).ceil();
-    final minLines =
-        innerHeight >= 200 ? (innerHeight / itemHeight).floor() : 3;
-    final hasScrollable = lines > minLines;
-    final height = (itemHeight + 8) * min(lines, minLines) - 8;
-    return Selector<Config, Set<String>>(
-      selector: (_, config) => config.currentUnfoldSet,
-      builder: (_, currentUnfoldSet, __) {
-        return CommonCard(
-          child: ExpansionTile(
-            childrenPadding: const EdgeInsets.all(8),
-            initiallyExpanded: currentUnfoldSet.contains(groupName),
-            iconColor: context.colorScheme.onSurfaceVariant,
-            onExpansionChanged: (value) {
-              final tempUnfoldSet = Set<String>.from(currentUnfoldSet);
-              if (value) {
-                tempUnfoldSet.add(groupName);
-              } else {
-                tempUnfoldSet.remove(groupName);
-              }
-              globalState.appController.config.updateCurrentUnfoldSet(
-                tempUnfoldSet,
-              );
-            },
-            controlAffinity: ListTileControlAffinity.trailing,
-            title: Row(
-              mainAxisSize: MainAxisSize.min,
-              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-              children: [
-                Flexible(
-                  flex: 1,
-                  child: Column(
-                    mainAxisSize: MainAxisSize.min,
-                    crossAxisAlignment: CrossAxisAlignment.start,
-                    children: [
-                      Text(groupName),
-                      const SizedBox(
-                        height: 4,
-                      ),
-                      Flexible(
-                        flex: 1,
-                        child: Row(
-                          mainAxisSize: MainAxisSize.min,
-                          mainAxisAlignment: MainAxisAlignment.start,
-                          crossAxisAlignment: CrossAxisAlignment.center,
-                          children: [
-                            Text(
-                              group.type.name,
-                              style: context.textTheme.labelMedium?.toLight,
-                            ),
-                            Flexible(
-                              flex: 1,
-                              child: _currentProxyNameBuilder(
-                                builder: (value) {
-                                  return Row(
-                                    mainAxisSize: MainAxisSize.min,
-                                    mainAxisAlignment: MainAxisAlignment.start,
-                                    crossAxisAlignment:
-                                        CrossAxisAlignment.center,
-                                    children: [
-                                      if (value.isNotEmpty) ...[
-                                        Icon(
-                                          Icons.arrow_right,
-                                          color: context
-                                              .colorScheme.onSurfaceVariant,
-                                        ),
-                                        Flexible(
-                                          flex: 1,
-                                          child: Text(
-                                            overflow: TextOverflow.ellipsis,
-                                            value,
-                                            style: context
-                                                .textTheme.labelMedium?.toLight,
-                                          ),
-                                        ),
-                                      ]
-                                    ],
-                                  );
-                                },
-                              ),
-                            ),
-                          ],
-                        ),
-                      ),
-                      const SizedBox(
-                        height: 4,
-                      ),
-                    ],
-                  ),
-                ),
-                IconButton(
-                  icon: Icon(
-                    Icons.network_ping,
-                    size: 20,
-                    color: context.colorScheme.onSurfaceVariant,
-                  ),
-                  onPressed: () {
-                    _delayTest(sortedProxies);
-                  },
-                ),
-              ],
-            ),
-            shape: const RoundedRectangleBorder(
-              side: BorderSide.none,
-            ),
-            collapsedShape: const RoundedRectangleBorder(
-              side: BorderSide.none,
-            ),
-            children: [
-              SizedBox(
-                height: height,
-                child: Platform.isAndroid
-                    ? _androidExpansionHandle(
-                        ValueListenableBuilder(
-                          valueListenable: isBoundaryNotifier,
-                          builder: (_, isBoundary, child) {
-                            return Scrollbar(
-                              thickness: 6,
-                              interactive: true,
-                              radius: const Radius.circular(6),
-                              child: GridView.builder(
-                                key: widget.key,
-                                controller: scrollController,
-                                physics: isBoundary || !hasScrollable
-                                    ? const NeverScrollableScrollPhysics()
-                                    : const AlwaysScrollableScrollPhysics(),
-                                gridDelegate:
-                                    SliverGridDelegateWithFixedCrossAxisCount(
-                                  crossAxisCount: columns,
-                                  mainAxisSpacing: 8,
-                                  crossAxisSpacing: 8,
-                                  mainAxisExtent: _getItemHeight(proxyCardType),
-                                ),
-                                itemCount: sortedProxies.length,
-                                itemBuilder: (_, index) {
-                                  final proxy = sortedProxies[index];
-                                  return _currentProxyNameBuilder(
-                                      builder: (value) {
-                                    return ProxyCard(
-                                      style: CommonCardType.filled,
-                                      type: proxyCardType,
-                                      isSelected: value == proxy.name,
-                                      key: ValueKey('$groupName.${proxy.name}'),
-                                      proxy: proxy,
-                                      groupName: groupName,
-                                    );
-                                  });
-                                },
-                              ),
-                            );
-                          },
-                        ),
-                      )
-                    : GridView.builder(
-                        key: widget.key,
-                        controller: scrollController,
-                        physics: !hasScrollable
-                            ? const NeverScrollableScrollPhysics()
-                            : const AlwaysScrollableScrollPhysics(),
-                        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-                          crossAxisCount: columns,
-                          mainAxisSpacing: 8,
-                          crossAxisSpacing: 8,
-                          mainAxisExtent: _getItemHeight(proxyCardType),
-                        ),
-                        itemCount: sortedProxies.length,
-                        itemBuilder: (_, index) {
-                          final proxy = sortedProxies[index];
-                          return _currentProxyNameBuilder(builder: (value) {
-                            return ProxyCard(
-                              style: CommonCardType.filled,
-                              type: proxyCardType,
-                              isSelected: value == proxy.name,
-                              key: ValueKey('$groupName.${proxy.name}'),
-                              proxy: proxy,
-                              groupName: groupName,
-                            );
-                          });
-                        },
-                      ),
-              ),
-            ],
-          ),
-        );
-      },
-    );
-  }
-
-  @override
-  void dispose() {
-    super.dispose();
-    isBoundaryNotifier.dispose();
-    scrollController.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return Selector2<AppState, Config, ProxyGroupSelectorState>(
-      selector: (_, appState, config) {
-        final group = appState.getGroupWithName(groupName)!;
-        return ProxyGroupSelectorState(
-          proxyCardType: config.proxyCardType,
-          proxiesSortType: config.proxiesSortType,
-          columns: globalState.appController.columns,
-          sortNum: appState.sortNum,
-          proxies: group.all,
-        );
-      },
-      builder: (_, state, __) {
-        final proxies = state.proxies;
-        final columns = state.columns;
-        final proxyCardType = state.proxyCardType;
-        return switch (type) {
-          ProxiesType.tab => _buildTabGroupView(
-              proxies: proxies,
-              columns: columns,
-              proxyCardType: proxyCardType,
-            ),
-          ProxiesType.expansion => _buildExpansionGroupView(
-              proxies: proxies,
-              columns: columns,
-              proxyCardType: proxyCardType,
-            ),
-        };
-      },
-    );
-  }
-}
-
-class DelayTestButtonContainer extends StatefulWidget {
-  final Widget child;
-  final Future Function() onClick;
-
-  const DelayTestButtonContainer({
-    super.key,
-    required this.child,
-    required this.onClick,
-  });
-
-  @override
-  State<DelayTestButtonContainer> createState() =>
-      _DelayTestButtonContainerState();
-}
-
-class _DelayTestButtonContainerState extends State<DelayTestButtonContainer>
-    with SingleTickerProviderStateMixin {
-  late AnimationController _controller;
-  late Animation<double> _scale;
-
-  _healthcheck() async {
-    _controller.forward();
-    await widget.onClick();
-    _controller.reverse();
-  }
-
-  @override
-  void initState() {
-    super.initState();
-    _controller = AnimationController(
-      vsync: this,
-      duration: const Duration(
-        milliseconds: 200,
-      ),
-    );
-    _scale = Tween<double>(
-      begin: 1.0,
-      end: 0.0,
-    ).animate(
-      CurvedAnimation(
-        parent: _controller,
-        curve: const Interval(
-          0,
-          1,
-        ),
-      ),
-    );
-  }
-
-  @override
-  void dispose() {
-    _controller.dispose();
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    _controller.reverse();
-    return FloatLayout(
-      floatingWidget: FloatWrapper(
-        child: AnimatedBuilder(
-          animation: _controller.view,
-          builder: (_, child) {
-            return SizedBox(
-              width: 56,
-              height: 56,
-              child: Transform.scale(
-                scale: _scale.value,
-                child: child,
-              ),
-            );
-          },
-          child: FloatingActionButton(
-            heroTag: null,
-            onPressed: _healthcheck,
-            child: const Icon(Icons.network_ping),
-          ),
-        ),
-      ),
-      child: widget.child,
-    );
-  }
-}
-
-class ProxyCard extends StatelessWidget {
-  final String groupName;
-  final Proxy proxy;
-  final bool isSelected;
-  final CommonCardType style;
-  final ProxyCardType type;
-
-  const ProxyCard({
-    super.key,
-    required this.groupName,
-    required this.proxy,
-    required this.isSelected,
-    this.style = CommonCardType.plain,
-    required this.type,
-  });
-
-  Measure get measure => globalState.appController.measure;
-
-  Widget _buildDelayText() {
-    return SizedBox(
-      height: measure.labelSmallHeight,
-      child: Selector<AppState, int?>(
-        selector: (context, appState) => appState.getDelay(
-          proxy.name,
-        ),
-        builder: (context, delay, __) {
-          return FadeBox(
-            child: Builder(
-              builder: (_) {
-                if (delay == null) {
-                  return Container();
-                }
-                if (delay == 0) {
-                  return SizedBox(
-                    height: measure.labelSmallHeight,
-                    width: measure.labelSmallHeight,
-                    child: const CircularProgressIndicator(
-                      strokeWidth: 2,
-                    ),
-                  );
-                }
-                return Text(
-                  delay > 0 ? '$delay ms' : "Timeout",
-                  style: context.textTheme.labelSmall?.copyWith(
-                    overflow: TextOverflow.ellipsis,
-                    color: other.getDelayColor(
-                      delay,
-                    ),
-                  ),
-                );
-              },
-            ),
-          );
-        },
-      ),
-    );
-  }
-
-  Widget _buildProxyNameText(BuildContext context) {
-    return SizedBox(
-      height: measure.bodyMediumHeight * 2,
-      child: Text(
-        proxy.name,
-        maxLines: 2,
-        style: context.textTheme.bodyMedium?.copyWith(
-          overflow: TextOverflow.ellipsis,
-        ),
-      ),
-    );
-  }
-
-  _changeProxy(BuildContext context) {
-    final appController = globalState.appController;
-    final group = appController.appState.getGroupWithName(groupName)!;
-    if (group.type != GroupType.Selector) {
-      globalState.showSnackBar(
-        context,
-        message: appLocalizations.notSelectedTip,
-      );
-      return;
-    }
-    globalState.appController.config.updateCurrentSelectedMap(
-      groupName,
-      proxy.name,
-    );
-    clashCore.changeProxy(
-      ChangeProxyParams(
-        groupName: groupName,
-        proxyName: proxy.name,
-      ),
-    );
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final measure = globalState.appController.measure;
-    final delayText = _buildDelayText();
-    final proxyNameText = _buildProxyNameText(context);
-    return CommonCard(
-      type: style,
-      key: key,
-      onPressed: () {
-        _changeProxy(context);
-      },
-      isSelected: isSelected,
-      child: Container(
-        padding: const EdgeInsets.all(12),
-        child: Column(
-          mainAxisSize: MainAxisSize.min,
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            proxyNameText,
-            const SizedBox(
-              height: 8,
-            ),
-            if (type == ProxyCardType.expand) ...[
-              SizedBox(
-                height: measure.bodySmallHeight,
-                child: Selector<AppState, String>(
-                  selector: (context, appState) => appState.getDesc(
-                    proxy.type,
-                    proxy.name,
-                  ),
-                  builder: (_, desc, __) {
-                    return TooltipText(
-                      text: Text(
-                        desc,
-                        style: context.textTheme.bodySmall?.copyWith(
-                          overflow: TextOverflow.ellipsis,
-                          color: context.textTheme.bodySmall?.color?.toLight(),
-                        ),
-                      ),
-                    );
-                  },
-                ),
-              ),
-              const SizedBox(
-                height: 8,
-              ),
-              delayText,
-            ] else
-              SizedBox(
-                height: measure.bodySmallHeight,
-                child: Row(
-                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                  crossAxisAlignment: CrossAxisAlignment.center,
-                  children: [
-                    Flexible(
-                      flex: 1,
-                      child: TooltipText(
-                        text: Text(
-                          proxy.type,
-                          style: context.textTheme.bodySmall?.copyWith(
-                            overflow: TextOverflow.ellipsis,
-                            color:
-                                context.textTheme.bodySmall?.color?.toLight(),
-                          ),
-                        ),
-                      ),
-                    ),
-                    delayText,
-                  ],
-                ),
-              )
-          ],
-        ),
-      ),
-    );
-  }
-}

lib/fragments/proxies/card.dart

@@ -0,0 +1,192 @@
+import 'package:fl_clash/clash/clash.dart';
+import 'package:fl_clash/common/common.dart';
+import 'package:fl_clash/enum/enum.dart';
+import 'package:fl_clash/models/models.dart';
+import 'package:fl_clash/state.dart';
+import 'package:fl_clash/widgets/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+
+class ProxyCard extends StatelessWidget {
+  final String groupName;
+  final Proxy proxy;
+  final bool isSelected;
+  final CommonCardType style;
+  final ProxyCardType type;
+
+  const ProxyCard({
+    super.key,
+    required this.groupName,
+    required this.proxy,
+    required this.isSelected,
+    this.style = CommonCardType.plain,
+    required this.type,
+  });
+
+  Measure get measure => globalState.appController.measure;
+
+  Widget _buildDelayText() {
+    return SizedBox(
+      height: measure.labelSmallHeight,
+      child: Selector<AppState, int?>(
+        selector: (context, appState) => appState.getDelay(
+          proxy.name,
+        ),
+        builder: (context, delay, __) {
+          return FadeBox(
+            child: Builder(
+              builder: (_) {
+                if (delay == null) {
+                  return Container();
+                }
+                if (delay == 0) {
+                  return SizedBox(
+                    height: measure.labelSmallHeight,
+                    width: measure.labelSmallHeight,
+                    child: const CircularProgressIndicator(
+                      strokeWidth: 2,
+                    ),
+                  );
+                }
+                return Text(
+                  delay > 0 ? '$delay ms' : "Timeout",
+                  style: context.textTheme.labelSmall?.copyWith(
+                    overflow: TextOverflow.ellipsis,
+                    color: other.getDelayColor(
+                      delay,
+                    ),
+                  ),
+                );
+              },
+            ),
+          );
+        },
+      ),
+    );
+  }
+
+  Widget _buildProxyNameText(BuildContext context) {
+    if (type == ProxyCardType.min) {
+      return SizedBox(
+        height: measure.bodyMediumHeight * 1,
+        child: Text(
+          proxy.name,
+          maxLines: 1,
+          style: context.textTheme.bodyMedium?.copyWith(
+            overflow: TextOverflow.ellipsis,
+          ),
+        ),
+      );
+    } else {
+      return SizedBox(
+        height: measure.bodyMediumHeight * 2,
+        child: Text(
+          proxy.name,
+          maxLines: 2,
+          style: context.textTheme.bodyMedium?.copyWith(
+            overflow: TextOverflow.ellipsis,
+          ),
+        ),
+      );
+    }
+  }
+
+  _changeProxy(BuildContext context) {
+    final appController = globalState.appController;
+    final group = appController.appState.getGroupWithName(groupName)!;
+    if (group.type != GroupType.Selector) {
+      globalState.showSnackBar(
+        context,
+        message: appLocalizations.notSelectedTip,
+      );
+      return;
+    }
+    globalState.appController.config.updateCurrentSelectedMap(
+      groupName,
+      proxy.name,
+    );
+    clashCore.changeProxy(
+      ChangeProxyParams(
+        groupName: groupName,
+        proxyName: proxy.name,
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final measure = globalState.appController.measure;
+    final delayText = _buildDelayText();
+    final proxyNameText = _buildProxyNameText(context);
+    return CommonCard(
+      type: style,
+      key: key,
+      onPressed: () {
+        _changeProxy(context);
+      },
+      isSelected: isSelected,
+      child: Container(
+        padding: const EdgeInsets.all(12),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            proxyNameText,
+            const SizedBox(
+              height: 8,
+            ),
+            if (type == ProxyCardType.expand) ...[
+              SizedBox(
+                height: measure.bodySmallHeight,
+                child: Selector<AppState, String>(
+                  selector: (context, appState) => appState.getDesc(
+                    proxy.type,
+                    proxy.name,
+                  ),
+                  builder: (_, desc, __) {
+                    return TooltipText(
+                      text: Text(
+                        desc,
+                        style: context.textTheme.bodySmall?.copyWith(
+                          overflow: TextOverflow.ellipsis,
+                          color: context.textTheme.bodySmall?.color?.toLight(),
+                        ),
+                      ),
+                    );
+                  },
+                ),
+              ),
+              const SizedBox(
+                height: 8,
+              ),
+              delayText,
+            ] else
+              SizedBox(
+                height: measure.bodySmallHeight,
+                child: Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  crossAxisAlignment: CrossAxisAlignment.center,
+                  children: [
+                    Flexible(
+                      flex: 1,
+                      child: TooltipText(
+                        text: Text(
+                          proxy.type,
+                          style: context.textTheme.bodySmall?.copyWith(
+                            overflow: TextOverflow.ellipsis,
+                            color:
+                                context.textTheme.bodySmall?.color?.toLight(),
+                          ),
+                        ),
+                      ),
+                    ),
+                    delayText,
+                  ],
+                ),
+              ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/fragments/proxies/group.dart

@@ -0,0 +1,404 @@
+import 'dart:math';
+
+import 'package:fl_clash/clash/clash.dart';
+import 'package:fl_clash/common/common.dart';
+import 'package:fl_clash/enum/enum.dart';
+import 'package:fl_clash/models/models.dart';
+import 'package:fl_clash/state.dart';
+import 'package:fl_clash/widgets/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+
+import 'card.dart';
+
+class ProxyGroupView extends StatefulWidget {
+  final String groupName;
+  final ProxiesType type;
+
+  const ProxyGroupView({
+    super.key,
+    required this.groupName,
+    required this.type,
+  });
+
+  @override
+  State<ProxyGroupView> createState() => _ProxyGroupViewState();
+}
+
+class _ProxyGroupViewState extends State<ProxyGroupView> {
+  var isLock = false;
+  final scrollController = ScrollController();
+  var isEnd = false;
+
+  String get groupName => widget.groupName;
+
+  ProxiesType get type => widget.type;
+
+  double _getItemHeight(ProxyCardType proxyCardType) {
+    final measure = globalState.appController.measure;
+    final baseHeight =
+        12 * 2 + measure.bodyMediumHeight * 2 + measure.bodySmallHeight + 8;
+    return switch(proxyCardType){
+      ProxyCardType.expand => baseHeight + measure.labelSmallHeight + 8,
+      ProxyCardType.shrink => baseHeight,
+      ProxyCardType.min => baseHeight - measure.bodyMediumHeight,
+    };
+  }
+
+  _delayTest(List<Proxy> proxies) async {
+    if (isLock) return;
+    isLock = true;
+    final appController = globalState.appController;
+    for (final proxy in proxies) {
+      final proxyName =
+          appController.appState.getRealProxyName(proxy.name) ?? proxy.name;
+      globalState.appController.setDelay(
+        Delay(
+          name: proxyName,
+          value: 0,
+        ),
+      );
+      clashCore.getDelay(proxyName).then((delay) {
+        globalState.appController.setDelay(delay);
+      });
+    }
+    await Future.delayed(httpTimeoutDuration + moreDuration);
+    appController.appState.sortNum++;
+    isLock = false;
+  }
+
+  Widget _currentProxyNameBuilder({
+    required Widget Function(String) builder,
+  }) {
+    return Selector2<AppState, Config, String>(
+      selector: (_, appState, config) {
+        final group = appState.getGroupWithName(groupName)!;
+        return config.currentSelectedMap[groupName] ?? group.now ?? '';
+      },
+      builder: (_, value, ___) {
+        return builder(value);
+      },
+    );
+  }
+
+  Widget _buildTabGroupView({
+    required List<Proxy> proxies,
+    required int columns,
+    required ProxyCardType proxyCardType,
+  }) {
+    final sortedProxies = globalState.appController.getSortProxies(
+      proxies,
+    );
+    return DelayTestButtonContainer(
+      onClick: () async {
+        await _delayTest(
+          proxies,
+        );
+      },
+      child: Align(
+        alignment: Alignment.topCenter,
+        child: GridView.builder(
+          padding: const EdgeInsets.all(16),
+          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+            crossAxisCount: columns,
+            mainAxisSpacing: 8,
+            crossAxisSpacing: 8,
+            mainAxisExtent: _getItemHeight(proxyCardType),
+          ),
+          itemCount: sortedProxies.length,
+          itemBuilder: (_, index) {
+            final proxy = sortedProxies[index];
+            return _currentProxyNameBuilder(builder: (value) {
+              return ProxyCard(
+                type: proxyCardType,
+                key: ValueKey('$groupName.${proxy.name}'),
+                isSelected: value == proxy.name,
+                proxy: proxy,
+                groupName: groupName,
+              );
+            });
+          },
+        ),
+      ),
+    );
+  }
+
+  Widget _buildExpansionGroupView({
+    required List<Proxy> proxies,
+    required int columns,
+    required ProxyCardType proxyCardType,
+  }) {
+    final sortedProxies = globalState.appController.getSortProxies(
+      proxies,
+    );
+    final group =
+    globalState.appController.appState.getGroupWithName(groupName)!;
+    final itemHeight = _getItemHeight(proxyCardType);
+    final innerHeight = context.appSize.height - 200;
+    final lines = (sortedProxies.length / columns).ceil();
+    final minLines =
+    innerHeight >= 200 ? (innerHeight / itemHeight).floor() : 3;
+    final height = (itemHeight + 8) * min(lines, minLines) - 8;
+    return Selector<Config, Set<String>>(
+      selector: (_, config) => config.currentUnfoldSet,
+      builder: (_, currentUnfoldSet, __) {
+        return CommonCard(
+          child: ExpansionTile(
+            childrenPadding: const EdgeInsets.all(8),
+            initiallyExpanded: currentUnfoldSet.contains(groupName),
+            iconColor: context.colorScheme.onSurfaceVariant,
+            onExpansionChanged: (value) {
+              final tempUnfoldSet = Set<String>.from(currentUnfoldSet);
+              if (value) {
+                tempUnfoldSet.add(groupName);
+              } else {
+                tempUnfoldSet.remove(groupName);
+              }
+              globalState.appController.config.updateCurrentUnfoldSet(
+                tempUnfoldSet,
+              );
+            },
+            controlAffinity: ListTileControlAffinity.trailing,
+            title: Row(
+              mainAxisSize: MainAxisSize.min,
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: [
+                Flexible(
+                  flex: 1,
+                  child: Column(
+                    mainAxisSize: MainAxisSize.min,
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      Text(groupName),
+                      const SizedBox(
+                        height: 4,
+                      ),
+                      Flexible(
+                        flex: 1,
+                        child: Row(
+                          mainAxisSize: MainAxisSize.min,
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.center,
+                          children: [
+                            Text(
+                              group.type.name,
+                              style: context.textTheme.labelMedium?.toLight,
+                            ),
+                            Flexible(
+                              flex: 1,
+                              child: _currentProxyNameBuilder(
+                                builder: (value) {
+                                  return Row(
+                                    mainAxisSize: MainAxisSize.min,
+                                    mainAxisAlignment: MainAxisAlignment.start,
+                                    crossAxisAlignment:
+                                    CrossAxisAlignment.center,
+                                    children: [
+                                      if (value.isNotEmpty) ...[
+                                        Icon(
+                                          Icons.arrow_right,
+                                          color: context
+                                              .colorScheme.onSurfaceVariant,
+                                        ),
+                                        Flexible(
+                                          flex: 1,
+                                          child: Text(
+                                            overflow: TextOverflow.ellipsis,
+                                            value,
+                                            style: context
+                                                .textTheme.labelMedium?.toLight,
+                                          ),
+                                        ),
+                                      ]
+                                    ],
+                                  );
+                                },
+                              ),
+                            ),
+                          ],
+                        ),
+                      ),
+                      const SizedBox(
+                        height: 4,
+                      ),
+                    ],
+                  ),
+                ),
+                IconButton(
+                  icon: Icon(
+                    Icons.network_ping,
+                    size: 20,
+                    color: context.colorScheme.onSurfaceVariant,
+                  ),
+                  onPressed: () {
+                    _delayTest(sortedProxies);
+                  },
+                ),
+              ],
+            ),
+            shape: const RoundedRectangleBorder(
+              side: BorderSide.none,
+            ),
+            collapsedShape: const RoundedRectangleBorder(
+              side: BorderSide.none,
+            ),
+            children: [
+              SizedBox(
+                height: height,
+                child: GridView.builder(
+                  key: widget.key,
+                  controller: scrollController,
+                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+                    crossAxisCount: columns,
+                    mainAxisSpacing: 8,
+                    crossAxisSpacing: 8,
+                    mainAxisExtent: _getItemHeight(proxyCardType),
+                  ),
+                  itemCount: sortedProxies.length,
+                  itemBuilder: (_, index) {
+                    final proxy = sortedProxies[index];
+                    return _currentProxyNameBuilder(
+                      builder: (value) {
+                        return ProxyCard(
+                          style: CommonCardType.filled,
+                          type: proxyCardType,
+                          isSelected: value == proxy.name,
+                          key: ValueKey('$groupName.${proxy.name}'),
+                          proxy: proxy,
+                          groupName: groupName,
+                        );
+                      },
+                    );
+                  },
+                ),
+              ),
+            ],
+          ),
+        );
+      },
+    );
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+    scrollController.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Selector2<AppState, Config, ProxyGroupSelectorState>(
+      selector: (_, appState, config) {
+        final group = appState.getGroupWithName(groupName)!;
+        return ProxyGroupSelectorState(
+          proxyCardType: config.proxyCardType,
+          proxiesSortType: config.proxiesSortType,
+          columns: globalState.appController.columns,
+          sortNum: appState.sortNum,
+          proxies: group.all,
+        );
+      },
+      builder: (_, state, __) {
+        final proxies = state.proxies;
+        final columns = state.columns;
+        final proxyCardType = state.proxyCardType;
+        return switch (type) {
+          ProxiesType.tab => _buildTabGroupView(
+            proxies: proxies,
+            columns: columns,
+            proxyCardType: proxyCardType,
+          ),
+          ProxiesType.list => _buildExpansionGroupView(
+            proxies: proxies,
+            columns: columns,
+            proxyCardType: proxyCardType,
+          ),
+        };
+      },
+    );
+  }
+}
+
+class DelayTestButtonContainer extends StatefulWidget {
+  final Widget child;
+  final Future Function() onClick;
+
+  const DelayTestButtonContainer({
+    super.key,
+    required this.child,
+    required this.onClick,
+  });
+
+  @override
+  State<DelayTestButtonContainer> createState() =>
+      _DelayTestButtonContainerState();
+}
+
+class _DelayTestButtonContainerState extends State<DelayTestButtonContainer>
+    with SingleTickerProviderStateMixin {
+  late AnimationController _controller;
+  late Animation<double> _scale;
+
+  _healthcheck() async {
+    _controller.forward();
+    await widget.onClick();
+    _controller.reverse();
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = AnimationController(
+      vsync: this,
+      duration: const Duration(
+        milliseconds: 200,
+      ),
+    );
+    _scale = Tween<double>(
+      begin: 1.0,
+      end: 0.0,
+    ).animate(
+      CurvedAnimation(
+        parent: _controller,
+        curve: const Interval(
+          0,
+          1,
+        ),
+      ),
+    );
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    _controller.reverse();
+    return FloatLayout(
+      floatingWidget: FloatWrapper(
+        child: AnimatedBuilder(
+          animation: _controller.view,
+          builder: (_, child) {
+            return SizedBox(
+              width: 56,
+              height: 56,
+              child: Transform.scale(
+                scale: _scale.value,
+                child: child,
+              ),
+            );
+          },
+          child: FloatingActionButton(
+            heroTag: null,
+            onPressed: _healthcheck,
+            child: const Icon(Icons.network_ping),
+          ),
+        ),
+      ),
+      child: widget.child,
+    );
+  }
+}

lib/fragments/proxies/list.dart

@@ -0,0 +1,50 @@
+import 'package:fl_clash/enum/enum.dart';
+import 'package:fl_clash/models/models.dart';
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+
+import 'group.dart';
+
+class ProxiesListFragment extends StatefulWidget {
+  const ProxiesListFragment({super.key});
+
+  @override
+  State<ProxiesListFragment> createState() =>
+      _ProxiesListFragmentState();
+}
+
+class _ProxiesListFragmentState
+    extends State<ProxiesListFragment> {
+  @override
+  Widget build(BuildContext context) {
+    return Selector2<AppState, Config, ProxiesSelectorState>(
+      selector: (_, appState, config) {
+        final currentGroups = appState.currentGroups;
+        final groupNames = currentGroups.map((e) => e.name).toList();
+        return ProxiesSelectorState(
+          groupNames: groupNames,
+          currentGroupName: config.currentGroupName,
+        );
+      },
+      builder: (_, state, __) {
+        return ListView.separated(
+          padding: const EdgeInsets.all(16),
+          itemCount: state.groupNames.length,
+          itemBuilder: (_, index) {
+            final groupName = state.groupNames[index];
+            return ProxyGroupView(
+              key: PageStorageKey(groupName),
+              groupName: groupName,
+              type: ProxiesType.list,
+            );
+          },
+          separatorBuilder: (BuildContext context, int index) {
+            return const SizedBox(
+              height: 16,
+            );
+          },
+        );
+      },
+    );
+  }
+}

lib/fragments/proxies/proxies.dart

@@ -0,0 +1,65 @@
+import 'package:fl_clash/common/app_localizations.dart';
+import 'package:fl_clash/enum/enum.dart';
+import 'package:fl_clash/fragments/proxies/list.dart';
+import 'package:fl_clash/models/models.dart';
+import 'package:fl_clash/widgets/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+
+import 'setting.dart';
+import 'tab.dart';
+
+class ProxiesFragment extends StatefulWidget {
+  const ProxiesFragment({super.key});
+
+  @override
+  State<ProxiesFragment> createState() => _ProxiesFragmentState();
+}
+
+class _ProxiesFragmentState extends State<ProxiesFragment> {
+
+  _initActions() {
+    WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
+      final commonScaffoldState =
+          context.findAncestorStateOfType<CommonScaffoldState>();
+      commonScaffoldState?.actions = [
+        IconButton(
+          onPressed: () {
+            showSheet(
+              title: appLocalizations.proxiesSetting,
+              context: context,
+              builder: (context) {
+                return const ProxiesSettingWidget();
+              },
+            );
+          },
+          icon: const Icon(
+            Icons.tune,
+          ),
+        )
+      ];
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Selector<AppState, bool>(
+      selector: (_, appState) => appState.currentLabel == 'proxies',
+      builder: (_, isCurrent, child) {
+        if (isCurrent) {
+          _initActions();
+        }
+        return child!;
+      },
+      child: Selector<Config, ProxiesType>(
+        selector: (_, config) => config.proxiesType,
+        builder: (_, proxiesType, __) {
+          return switch (proxiesType) {
+            ProxiesType.tab => const ProxiesTabFragment(),
+            ProxiesType.list => const ProxiesListFragment(),
+          };
+        },
+      ),
+    );
+  }
+}

lib/fragments/proxies/setting.dart

@@ -0,0 +1,262 @@
+import 'package:fl_clash/common/common.dart';
+import 'package:fl_clash/enum/enum.dart';
+import 'package:fl_clash/models/models.dart';
+import 'package:fl_clash/state.dart';
+import 'package:fl_clash/widgets/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:intl/intl.dart';
+import 'package:provider/provider.dart';
+
+class ProxiesSettingWidget extends StatelessWidget {
+  const ProxiesSettingWidget({super.key});
+
+  IconData _getIconWithProxiesType(ProxiesType type) {
+    return switch (type) {
+      ProxiesType.tab => Icons.view_carousel,
+      ProxiesType.list => Icons.view_list,
+    };
+  }
+
+  IconData _getIconWithProxiesSortType(ProxiesSortType type) {
+    return switch (type) {
+      ProxiesSortType.none => Icons.sort,
+      ProxiesSortType.delay => Icons.network_ping,
+      ProxiesSortType.name => Icons.sort_by_alpha,
+    };
+  }
+
+  String _getStringProxiesSortType(ProxiesSortType type) {
+    return switch (type) {
+      ProxiesSortType.none => appLocalizations.defaultText,
+      ProxiesSortType.delay => appLocalizations.delay,
+      ProxiesSortType.name => appLocalizations.name,
+    };
+  }
+
+  List<Widget> _buildStyleSetting() {
+    return generateSection(
+      title: appLocalizations.style,
+      items: [
+        SingleChildScrollView(
+          padding: const EdgeInsets.symmetric(horizontal: 16),
+          scrollDirection: Axis.horizontal,
+          child: Selector<Config, ProxiesType>(
+            selector: (_, config) => config.proxiesType,
+            builder: (_, proxiesType, __) {
+              final config = globalState.appController.config;
+              return Wrap(
+                spacing: 16,
+                children: [
+                  for (final item in ProxiesType.values)
+                    SettingInfoCard(
+                      Info(
+                        label: Intl.message(item.name),
+                        iconData: _getIconWithProxiesType(item),
+                      ),
+                      isSelected: proxiesType == item,
+                      onPressed: () {
+                        config.proxiesType = item;
+                      },
+                    )
+                ],
+              );
+            },
+          ),
+        )
+      ],
+    );
+  }
+
+  List<Widget> _buildSortSetting() {
+    return generateSection(
+      title: appLocalizations.sort,
+      items: [
+        SingleChildScrollView(
+          padding: const EdgeInsets.symmetric(horizontal: 16),
+          scrollDirection: Axis.horizontal,
+          child: Selector<Config, ProxiesSortType>(
+            selector: (_, config) => config.proxiesSortType,
+            builder: (_, proxiesSortType, __) {
+              final config = globalState.appController.config;
+              return Wrap(
+                spacing: 16,
+                children: [
+                  for (final item in ProxiesSortType.values)
+                    SettingInfoCard(
+                      Info(
+                        label: _getStringProxiesSortType(item),
+                        iconData: _getIconWithProxiesSortType(item),
+                      ),
+                      isSelected: proxiesSortType == item,
+                      onPressed: () {
+                        config.proxiesSortType = item;
+                      },
+                    ),
+                ],
+              );
+            },
+          ),
+        ),
+      ],
+    );
+  }
+
+  List<Widget> _buildSizeSetting() {
+    return generateSection(
+      title: appLocalizations.size,
+      items: [
+        SingleChildScrollView(
+          padding: const EdgeInsets.symmetric(horizontal: 16),
+          scrollDirection: Axis.horizontal,
+          child: Selector<Config, ProxyCardType>(
+            selector: (_, config) => config.proxyCardType,
+            builder: (_, proxyCardType, __) {
+              final config = globalState.appController.config;
+              return Wrap(
+                spacing: 16,
+                children: [
+                  for (final item in ProxyCardType.values)
+                    SettingTextCard(
+                      Intl.message(item.name),
+                      isSelected: item == proxyCardType,
+                      onPressed: () {
+                        config.proxyCardType = item;
+                      },
+                    )
+                ],
+              );
+            },
+          ),
+        )
+      ],
+    );
+  }
+
+  List<Widget> _buildColumnsSetting() {
+    return generateSection(
+      title: appLocalizations.columns,
+      items: [
+        SingleChildScrollView(
+          padding: const EdgeInsets.symmetric(
+            horizontal: 16,
+          ),
+          scrollDirection: Axis.horizontal,
+          child: Selector2<AppState, Config, ColumnsSelectorState>(
+            selector: (_, appState, config) => ColumnsSelectorState(
+              columns: config.proxiesColumns,
+              viewMode: appState.viewMode,
+            ),
+            builder: (_, state, __) {
+              final config = globalState.appController.config;
+              final targetColumnsArray = viewModeColumnsMap[state.viewMode]!;
+              final currentColumns = other.getColumns(
+                state.viewMode,
+                state.columns,
+              );
+              return Wrap(
+                spacing: 16,
+                children: [
+                  for (final item in targetColumnsArray)
+                    SettingTextCard(
+                      other.getColumnsTextForInt(item),
+                      isSelected: item == currentColumns,
+                      onPressed: () {
+                        config.proxiesColumns = item;
+                      },
+                    )
+                ],
+              );
+            },
+          ),
+        ),
+      ],
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(bottom: 32),
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          ..._buildStyleSetting(),
+          ..._buildSortSetting(),
+          ..._buildColumnsSetting(),
+          ..._buildSizeSetting(),
+        ],
+      ),
+    );
+  }
+}
+
+class SettingInfoCard extends StatelessWidget {
+  final Info info;
+  final bool? isSelected;
+  final VoidCallback onPressed;
+
+  const SettingInfoCard(
+    this.info, {
+    super.key,
+    this.isSelected,
+    required this.onPressed,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return CommonCard(
+      isSelected: isSelected,
+      onPressed: onPressed,
+      child: Padding(
+        padding: const EdgeInsets.all(12),
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          mainAxisAlignment: MainAxisAlignment.start,
+          children: [
+            Flexible(
+              child: Icon(info.iconData),
+            ),
+            const SizedBox(
+              width: 8,
+            ),
+            Flexible(
+              child: Text(
+                info.label,
+                style: context.textTheme.bodyMedium,
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class SettingTextCard extends StatelessWidget {
+  final String text;
+  final bool? isSelected;
+  final VoidCallback onPressed;
+
+  const SettingTextCard(
+    this.text, {
+    super.key,
+    this.isSelected,
+    required this.onPressed,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return CommonCard(
+      onPressed: onPressed,
+      isSelected: isSelected,
+      child: Padding(
+        padding: const EdgeInsets.all(12),
+        child: Text(
+          text,
+          style: context.textTheme.bodyMedium,
+        ),
+      ),
+    );
+  }
+}

lib/fragments/proxies/tab.dart

@@ -0,0 +1,219 @@
+import 'package:collection/collection.dart';
+import 'package:fl_clash/common/common.dart';
+import 'package:fl_clash/enum/enum.dart';
+import 'package:fl_clash/fragments/proxies/setting.dart';
+import 'package:fl_clash/models/models.dart';
+import 'package:fl_clash/state.dart';
+import 'package:fl_clash/widgets/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+
+import 'group.dart';
+
+class ProxiesTabFragment extends StatefulWidget {
+  const ProxiesTabFragment({super.key});
+
+  @override
+  State<ProxiesTabFragment> createState() => _ProxiesTabFragmentState();
+}
+
+class _ProxiesTabFragmentState extends State<ProxiesTabFragment>
+    with TickerProviderStateMixin {
+  TabController? _tabController;
+  final hasMoreButtonNotifier = ValueNotifier<bool>(false);
+
+  @override
+  void dispose() {
+    super.dispose();
+    _tabController?.dispose();
+  }
+
+  _buildMoreButton() {
+    return Selector<AppState, bool>(
+      selector: (_, appState) => appState.viewMode == ViewMode.mobile,
+      builder: (_, value, ___) {
+        return IconButton(
+          onPressed: _showMoreMenu,
+          icon: value
+              ? const Icon(
+                  Icons.expand_more,
+                )
+              : const Icon(
+                  Icons.chevron_right,
+                ),
+        );
+      },
+    );
+  }
+
+  _showMoreMenu() {
+    showSheet(
+      context: context,
+      width: 380,
+      isScrollControlled: false,
+      builder: (context) {
+        return SingleChildScrollView(
+          padding: const EdgeInsets.all(16),
+          child: Selector2<AppState, Config, ProxiesSelectorState>(
+            selector: (_, appState, config) {
+              final currentGroups = appState.currentGroups;
+              final groupNames = currentGroups.map((e) => e.name).toList();
+              return ProxiesSelectorState(
+                groupNames: groupNames,
+                currentGroupName: config.currentGroupName,
+              );
+            },
+            builder: (_, state, __) {
+              return SizedBox(
+                width: double.infinity,
+                child: Wrap(
+                  alignment: WrapAlignment.center,
+                  runSpacing: 8,
+                  spacing: 8,
+                  children: [
+                    for (final groupName in state.groupNames)
+                      SettingTextCard(
+                        groupName,
+                        onPressed: () {
+                          final index = state.groupNames
+                              .indexWhere((item) => item == groupName);
+                          if (index == -1) return;
+                          _tabController?.animateTo(index);
+                          globalState.appController.config
+                              .updateCurrentGroupName(
+                            groupName,
+                          );
+                        },
+                        isSelected: groupName == state.currentGroupName,
+                      )
+                  ],
+                ),
+              );
+            },
+          ),
+        );
+      },
+      title: appLocalizations.proxyGroup,
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Selector2<AppState, Config, ProxiesSelectorState>(
+      selector: (_, appState, config) {
+        final currentGroups = appState.currentGroups;
+        final groupNames = currentGroups.map((e) => e.name).toList();
+        return ProxiesSelectorState(
+          groupNames: groupNames,
+          currentGroupName: config.currentGroupName,
+        );
+      },
+      shouldRebuild: (prev, next) {
+        if (!const ListEquality<String>()
+            .equals(prev.groupNames, next.groupNames)) {
+          _tabController?.dispose();
+          _tabController = null;
+          return true;
+        }
+        return false;
+      },
+      builder: (_, state, __) {
+        final index = state.groupNames.indexWhere(
+          (item) => item == state.currentGroupName,
+        );
+        _tabController ??= TabController(
+          length: state.groupNames.length,
+          initialIndex: index == -1 ? 0 : index,
+          vsync: this,
+        );
+        return Column(
+          mainAxisAlignment: MainAxisAlignment.start,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            NotificationListener<ScrollMetricsNotification>(
+              onNotification: (scrollNotification) {
+                hasMoreButtonNotifier.value =
+                    scrollNotification.metrics.maxScrollExtent > 0;
+                return true;
+              },
+              child: ValueListenableBuilder(
+                valueListenable: hasMoreButtonNotifier,
+                builder: (_, value, child) {
+                  return Stack(
+                    alignment: AlignmentDirectional.centerStart,
+                    children: [
+                      TabBar(
+                        controller: _tabController,
+                        padding: EdgeInsets.only(
+                          left: 16,
+                          right: 16 + (value ? 16 : 0),
+                        ),
+                        onTap: (index) {
+                          final appController = globalState.appController;
+                          final currentGroups =
+                              appController.appState.currentGroups;
+                          if (currentGroups.length > index) {
+                            appController.config.updateCurrentGroupName(
+                              currentGroups[index].name,
+                            );
+                          }
+                        },
+                        dividerColor: Colors.transparent,
+                        isScrollable: true,
+                        tabAlignment: TabAlignment.start,
+                        overlayColor:
+                            const WidgetStatePropertyAll(Colors.transparent),
+                        tabs: [
+                          for (final groupName in state.groupNames)
+                            Tab(
+                              text: groupName,
+                            ),
+                        ],
+                      ),
+                      if (value)
+                        Positioned(
+                          right: 0,
+                          child: child!,
+                        ),
+                    ],
+                  );
+                },
+                child: Container(
+                  decoration: BoxDecoration(
+                    gradient: LinearGradient(
+                        begin: Alignment.centerLeft,
+                        end: Alignment.centerRight,
+                        colors: [
+                          context.colorScheme.surface.withOpacity(0.1),
+                          context.colorScheme.surface,
+                        ],
+                        stops: const [
+                          0.0,
+                          0.1
+                        ]),
+                  ),
+                  child: _buildMoreButton(),
+                ),
+              ),
+            ),
+            Expanded(
+              child: TabBarView(
+                controller: _tabController,
+                children: [
+                  for (final groupName in state.groupNames)
+                    KeepContainer(
+                      key: ObjectKey(groupName),
+                      child: ProxyGroupView(
+                        groupName: groupName,
+                        type: ProxiesType.tab,
+                      ),
+                    ),
+                ],
+              ),
+            )
+          ],
+        );
+      },
+    );
+  }
+}

lib/fragments/requests.dart

@@ -1,11 +1,9 @@
 import 'dart:async';
-import 'dart:io';
 
 import 'package:collection/collection.dart';
 import 'package:fl_clash/common/common.dart';
 import 'package:fl_clash/enum/enum.dart';
 import 'package:fl_clash/models/models.dart';
-import 'package:fl_clash/plugins/app.dart';
 import 'package:fl_clash/state.dart';
 import 'package:fl_clash/widgets/widgets.dart';
 import 'package:flutter/material.dart';
@@ -68,9 +66,6 @@ class _RequestsFragmentState extends State<RequestsFragment> {
             },
             icon: const Icon(Icons.search),
           ),
-          const SizedBox(
-            width: 8,
-          )
         ];
       },
     );
@@ -137,8 +132,8 @@ class _RequestsFragmentState extends State<RequestsFragment> {
                     vertical: 16,
                   ),
                   child: Wrap(
-                    runSpacing: 8,
+                    runSpacing: 6,
-                    spacing: 8,
+                    spacing: 6,
                     children: [
                       for (final keyword in state.keywords)
                         CommonChip(
@@ -156,7 +151,7 @@ class _RequestsFragmentState extends State<RequestsFragment> {
                   controller: _scrollController,
                   itemBuilder: (_, index) {
                     final connection = connections[index];
-                    return RequestItem(
+                    return ConnectionItem(
                       key: Key(connection.id),
                       connection: connection,
                       onClick: _addKeyword,
@@ -178,103 +173,6 @@ class _RequestsFragmentState extends State<RequestsFragment> {
   }
 }
 
-class RequestItem extends StatelessWidget {
-  final Connection connection;
-  final Function(String)? onClick;
-
-  const RequestItem({
-    super.key,
-    required this.connection,
-    this.onClick,
-  });
-
-  Future<ImageProvider?> _getPackageIcon(Connection connection) async {
-    return await app?.getPackageIcon(connection.metadata.process);
-  }
-
-  String _getRequestText(Metadata metadata) {
-    var text = "${metadata.network}://";
-    final ips = [
-      metadata.host,
-      metadata.destinationIP,
-    ].where((ip) => ip.isNotEmpty);
-    text += ips.join("/");
-    text += ":${metadata.destinationPort}";
-    return text;
-  }
-
-  String _getSourceText(Connection connection) {
-    final metadata = connection.metadata;
-    if (metadata.process.isEmpty) {
-      return connection.start.lastUpdateTimeDesc;
-    }
-    return "${metadata.process} · ${connection.start.lastUpdateTimeDesc}";
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return ListItem(
-      tileTitleAlignment: ListTileTitleAlignment.titleHeight,
-      leading: Platform.isAndroid
-          ? Container(
-              margin: const EdgeInsets.only(top: 4),
-              width: 48,
-              height: 48,
-              child: FutureBuilder<ImageProvider?>(
-                future: _getPackageIcon(connection),
-                builder: (_, snapshot) {
-                  if (!snapshot.hasData && snapshot.data == null) {
-                    return Container();
-                  } else {
-                    return Image(
-                      image: snapshot.data!,
-                      gaplessPlayback: true,
-                      width: 48,
-                      height: 48,
-                    );
-                  }
-                },
-              ),
-            )
-          : null,
-      title: Text(
-        _getRequestText(connection.metadata),
-      ),
-      subtitle: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          const SizedBox(
-            height: 12,
-          ),
-          Text(
-            _getSourceText(connection),
-          ),
-          const SizedBox(
-            height: 12,
-          ),
-          Wrap(
-            runSpacing: 8,
-            spacing: 8,
-            children: [
-              for (final chain in connection.chains)
-                CommonChip(
-                  label: chain,
-                  onPressed: () {
-                    if (onClick == null) return;
-                    onClick!(chain);
-                  },
-                ),
-            ],
-          ),
-          const SizedBox(
-            height: 12,
-          ),
-        ],
-      ),
-    );
-  }
-}
-
 class RequestsSearchDelegate extends SearchDelegate {
   ValueNotifier<ConnectionsAndKeywords> requestsNotifier;
 
@@ -375,8 +273,8 @@ class RequestsSearchDelegate extends SearchDelegate {
                   vertical: 16,
                 ),
                 child: Wrap(
-                  runSpacing: 8,
+                  runSpacing: 6,
-                  spacing: 8,
+                  spacing: 6,
                   children: [
                     for (final keyword in state.keywords)
                       CommonChip(
@@ -393,7 +291,7 @@ class RequestsSearchDelegate extends SearchDelegate {
               child: ListView.separated(
                 itemBuilder: (_, index) {
                   final connection = _results[index];
-                  return RequestItem(
+                  return ConnectionItem(
                     key: Key(connection.id),
                     connection: connection,
                     onClick: (value) {

lib/fragments/resources.dart

@@ -2,22 +2,37 @@ import 'dart:io';
 
 import 'package:fl_clash/clash/clash.dart';
 import 'package:fl_clash/common/common.dart';
-import 'package:fl_clash/models/ffi.dart';
+import 'package:fl_clash/models/models.dart';
+import 'package:fl_clash/state.dart';
 import 'package:fl_clash/widgets/widgets.dart';
 import 'package:flutter/material.dart';
 import 'package:path/path.dart' hide context;
+import 'package:provider/provider.dart';
 
 @immutable
 class GeoItem {
   final String label;
+  final String key;
   final String fileName;
 
   const GeoItem({
     required this.label,
+    required this.key,
     required this.fileName,
   });
 }
 
+@immutable
+class FileInfo {
+  final String size;
+  final DateTime lastModified;
+
+  const FileInfo({
+    required this.size,
+    required this.lastModified,
+  });
+}
+
 class Resources extends StatefulWidget {
   const Resources({super.key});
 
@@ -26,147 +41,473 @@ class Resources extends StatefulWidget {
 }
 
 class _ResourcesState extends State<Resources> {
-  _updateExternalProvider(
+  List<ExternalProvider> externalProviders = [];
-    String providerName,
+
-    String providerType,
+  List<GlobalObjectKey<_ProviderItemState>> providerItemKeys = [];
-  ) async {
+
-    final commonScaffoldState = context.commonScaffoldState;
+  @override
-    await commonScaffoldState?.loadingRun(() async {
+  void initState() {
-      final message = await clashCore.updateExternalProvider(
+    super.initState();
-        providerName: providerName,
+    WidgetsBinding.instance.addPostFrameCallback((_) {
-        providerType: providerType,
+      _syncExternalProviders();
-      );
-      if (message.isNotEmpty) throw message;
     });
-    setState(() {});
   }
 
-  Future<DateTime> _getGeoFileLastModified(String fileName) async {
+  _syncExternalProviders() async {
-    final homePath = await appPath.getHomeDirPath();
+    externalProviders = await clashCore.getExternalProviders();
-    return await File(join(homePath, fileName)).lastModified();
+    if (mounted) {
+      setState(() {});
+    }
   }
 
-  Widget _buildExternalProviderSection() {
+  _updateProviders() async {
-    return FutureBuilder<List<ExternalProvider>>(
+    final updateProviders = providerItemKeys.map<Future>(
-      future: () async {
+      (key) async => await key.currentState?.updateProvider(false),
-        await Future.delayed(const Duration(milliseconds: 200));
-        return await clashCore.getExternalProviders();
-      }(),
-      builder: (_, snapshot) {
-        return Center(
-          child: FadeBox(
-            key: const Key("external_providers"),
-            child: snapshot.data == null || snapshot.data!.isEmpty
-                ? Container()
-                : Section(
-                    title: appLocalizations.externalResources,
-                    child: Column(
-                      children: [
-                        for (final externalProvider in snapshot.data!)
-                          ListItem(
-                            title: Text(externalProvider.name),
-                            subtitle: Text(
-                              "${externalProvider.type} (${externalProvider.vehicleType})",
-                            ),
-                            trailing: Row(
-                              mainAxisSize: MainAxisSize.min,
-                              children: [
-                                Text(
-                                  externalProvider.updateAt.lastUpdateTimeDesc,
-                                  style: context.textTheme.bodyMedium,
-                                ),
-                                const Padding(
-                                  padding: EdgeInsets.only(left: 12,right: 4),
-                                  child: VerticalDivider(
-                                    endIndent: 6,
-                                    width: 4,
-                                    indent: 6,
-                                  ),
-                                ),
-                                externalProvider.vehicleType == "HTTP"
-                                    ? IconButton(
-                                        icon: const Icon(Icons.sync),
-                                        onPressed: () {
-                                          _updateExternalProvider(
-                                            externalProvider.name,
-                                            externalProvider.type,
-                                          );
-                                        },
-                                      )
-                                    : Container(),
-                              ],
-                            ),
-                          )
-                      ],
-                    ),
-                  ),
-          ),
-        );
-      },
     );
+    await Future.wait(updateProviders);
+    _syncExternalProviders();
   }
 
-  Widget _buildGeoDataSection() {
+  List<Widget> _buildExternalProviderSection() {
+    List<GlobalObjectKey<_ProviderItemState>> keys = [];
+    final res = generateInfoSection(
+      info: Info(
+        iconData: Icons.source,
+        label: appLocalizations.externalResources,
+      ),
+      actions: [
+        IconButton.filledTonal(
+          onPressed: () {
+            _updateProviders();
+          },
+          padding: const EdgeInsets.all(4),
+          iconSize: 20,
+          icon: const Icon(
+            Icons.sync,
+          ),
+        )
+      ],
+      items: externalProviders.map(
+        (externalProvider) {
+          final key =
+              GlobalObjectKey<_ProviderItemState>(externalProvider.name);
+          keys.add(key);
+          return ProviderItem(
+            key: key,
+            provider: externalProvider,
+            onUpdated: () {
+              _syncExternalProviders();
+            },
+          );
+        },
+      ),
+    );
+    providerItemKeys = keys;
+    return res;
+  }
+
+  List<Widget> _buildGeoDataSection() {
     const geoItems = <GeoItem>[
-      GeoItem(label: "GeoIp", fileName: mmdbFileName),
+      GeoItem(
-      GeoItem(label: "GeoSite", fileName: geoSiteFileName),
+        label: "GeoIp",
-      GeoItem(label: "ASN", fileName: asnFileName),
+        fileName: geoIpFileName,
+        key: "geoip",
+      ),
+      GeoItem(label: "GeoSite", fileName: geoSiteFileName, key: "geosite"),
+      GeoItem(
+        label: "MMDB",
+        fileName: mmdbFileName,
+        key: "mmdb",
+      ),
+      GeoItem(label: "ASN", fileName: asnFileName, key: "asn"),
     ];
-    return Section(
+
-      title: appLocalizations.geoData,
+    return generateInfoSection(
-      child: Column(
+      info: Info(
-        children: [
+        iconData: Icons.storage,
-          for (final geoItem in geoItems)
+        label: appLocalizations.geoData,
-            ListItem(
+      ),
-              title: Text(geoItem.label),
+      items: geoItems.map(
-              subtitle: FutureBuilder<DateTime>(
+        (geoItem) => GeoDataListItem(
-                future: () async {
+          geoItem: geoItem,
-                  await Future.delayed(const Duration(milliseconds: 200));
+        ),
-                  return await _getGeoFileLastModified(geoItem.fileName);
-                }(),
-                builder: (_, snapshot) {
-                  return Container(
-                    alignment: Alignment.centerLeft,
-                    height: 24,
-                    child: FadeBox(
-                      key: Key("fade_box_${geoItem.label}"),
-                      child: snapshot.data == null
-                          ? const SizedBox(
-                              width: 24,
-                              height: 24,
-                              child: CircularProgressIndicator(
-                                strokeWidth: 2,
-                              ),
-                            )
-                          : Text(
-                              snapshot.data!.lastUpdateTimeDesc,
-                            ),
-                    ),
-                  );
-                },
-              ),
-              trailing: IconButton(
-                icon: const Icon(Icons.sync),
-                onPressed: () {
-                  _updateExternalProvider(
-                    geoItem.fileName,
-                    geoItem.label,
-                  );
-                },
-              ),
-            ),
-        ],
       ),
     );
   }
 
   @override
   Widget build(BuildContext context) {
-    return ListView(
+    return generateListView(
-      children: [
+      [
-        _buildGeoDataSection(),
+        ..._buildGeoDataSection(),
-        _buildExternalProviderSection(),
+        ..._buildExternalProviderSection(),
       ],
     );
   }
 }
+
+class GeoDataListItem extends StatefulWidget {
+  final GeoItem geoItem;
+
+  const GeoDataListItem({
+    super.key,
+    required this.geoItem,
+  });
+
+  @override
+  State<GeoDataListItem> createState() => _GeoDataListItemState();
+}
+
+class _GeoDataListItemState extends State<GeoDataListItem> {
+  final isUpdating = ValueNotifier<bool>(false);
+
+  GeoItem get geoItem => widget.geoItem;
+
+  _updateUrl(String url) async {
+    final newUrl = await globalState.showCommonDialog<String>(
+      child: UpdateGeoUrlFormDialog(
+        title: geoItem.label,
+        url: url,
+      ),
+    );
+    if (newUrl != null && newUrl != url && mounted) {
+      try {
+        if (!newUrl.isUrl) {
+          throw "Invalid url";
+        }
+        final appController = globalState.appController;
+        appController.clashConfig.geoXUrl =
+            Map.from(appController.clashConfig.geoXUrl)..[geoItem.key] = newUrl;
+        appController.updateClashConfigDebounce();
+      } catch (e) {
+        globalState.showMessage(
+          title: geoItem.label,
+          message: TextSpan(
+            text: e.toString(),
+          ),
+        );
+      }
+    }
+  }
+
+  Future<FileInfo> _getGeoFileLastModified(String fileName) async {
+    final homePath = await appPath.getHomeDirPath();
+    final file = File(join(homePath, fileName));
+    final lastModified = await file.lastModified();
+    final size = await file.length();
+    return FileInfo(
+      size: TrafficValue(value: size).show,
+      lastModified: lastModified,
+    );
+  }
+
+  // _uploadGeoFile(String fileName) async {
+  //   final res = await picker.pickerGeoDataFile();
+  //   if (res == null || res.bytes == null) return;
+  //   final homePath = await appPath.getHomeDirPath();
+  //   final file = File(join(homePath, fileName));
+  //   await file.writeAsBytes(
+  //     res.bytes!,
+  //     flush: true,
+  //   );
+  //   setState(() {});
+  // }
+
+  String _buildFileInfoDesc(FileInfo fileInfo) {
+    return "${fileInfo.size}  ·  ${fileInfo.lastModified.lastUpdateTimeDesc}";
+  }
+
+  Widget _buildSubtitle(String url) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        const SizedBox(
+          height: 4,
+        ),
+        FutureBuilder<FileInfo>(
+          future: _getGeoFileLastModified(geoItem.fileName),
+          builder: (_, snapshot) {
+            return SizedBox(
+              height: 24,
+              child: FadeBox(
+                key: Key("fade_box_${geoItem.label}"),
+                child: snapshot.data == null
+                    ? const SizedBox(
+                        width: 24,
+                        height: 24,
+                        child: CircularProgressIndicator(
+                          strokeWidth: 2,
+                        ),
+                      )
+                    : Text(
+                        _buildFileInfoDesc(snapshot.data!),
+                      ),
+              ),
+            );
+          },
+        ),
+        Text(
+          url,
+          style: context.textTheme.bodyMedium?.toLight,
+        ),
+        const SizedBox(
+          height: 8,
+        ),
+        const SizedBox(
+          height: 8,
+        ),
+        Wrap(
+          runSpacing: 6,
+          spacing: 12,
+          children: [
+            CommonChip(
+              avatar: const Icon(Icons.edit),
+              label: appLocalizations.edit,
+              onPressed: () {
+                _updateUrl(url);
+              },
+            ),
+            CommonChip(
+              avatar: const Icon(Icons.sync),
+              label: appLocalizations.sync,
+              onPressed: () {
+                _handleUpdateGeoDataItem();
+              },
+            ),
+          ],
+        ),
+      ],
+    );
+  }
+
+  _handleUpdateGeoDataItem() async {
+    await globalState.safeRun<void>(updateGeoDateItem);
+    setState(() {});
+  }
+
+  updateGeoDateItem() async {
+    isUpdating.value = true;
+    try {
+      final message = await clashCore.updateExternalProvider(
+        providerName: geoItem.fileName,
+        providerType: geoItem.label,
+      );
+      if (message.isNotEmpty) throw message;
+    } catch (e) {
+      isUpdating.value = false;
+      rethrow;
+    }
+    isUpdating.value = false;
+    return null;
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+    isUpdating.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return ListItem(
+      padding: const EdgeInsets.symmetric(
+        horizontal: 16,
+        vertical: 4,
+      ),
+      title: Text(geoItem.label),
+      subtitle: Selector<ClashConfig, String>(
+        selector: (_, clashConfig) => clashConfig.geoXUrl[geoItem.key]!,
+        builder: (_, value, __) {
+          return _buildSubtitle(value);
+        },
+      ),
+      trailing: SizedBox(
+        height: 48,
+        width: 48,
+        child: ValueListenableBuilder(
+          valueListenable: isUpdating,
+          builder: (_, isUpdating, ___) {
+            return FadeBox(
+              child: isUpdating
+                  ? const Padding(
+                      padding: EdgeInsets.all(8),
+                      child: CircularProgressIndicator(),
+                    )
+                  : const SizedBox(),
+            );
+          },
+        ),
+      ),
+    );
+  }
+}
+
+class ProviderItem extends StatefulWidget {
+  final ExternalProvider provider;
+  final Function onUpdated;
+
+  const ProviderItem({
+    super.key,
+    required this.provider,
+    required this.onUpdated,
+  });
+
+  @override
+  State<ProviderItem> createState() => _ProviderItemState();
+}
+
+class _ProviderItemState extends State<ProviderItem> {
+  final isUpdating = ValueNotifier<bool>(false);
+
+  ExternalProvider get provider => widget.provider;
+
+  _handleUpdateProfile() async {
+    await globalState.safeRun<void>(updateProvider);
+    widget.onUpdated();
+  }
+
+  updateProvider([isSingle = true]) async {
+    if (provider.vehicleType != "HTTP") return;
+    isUpdating.value = true;
+    try {
+      final message = await clashCore.updateExternalProvider(
+        providerName: provider.name,
+        providerType: provider.type,
+      );
+      if (message.isNotEmpty) throw message;
+    } catch (e) {
+      isUpdating.value = false;
+      if (!isSingle) {
+        return e.toString();
+      } else {
+        rethrow;
+      }
+    }
+    isUpdating.value = false;
+    return null;
+  }
+
+  String _buildProviderDesc() {
+    return "${provider.type} (${provider.vehicleType})  ·  ${provider.updateAt.lastUpdateTimeDesc}";
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+    isUpdating.dispose();
+  }
+
+  Widget _buildSubtitle() {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        const SizedBox(
+          height: 4,
+        ),
+        Text(
+          _buildProviderDesc(),
+        ),
+        if (provider.vehicleType == "HTTP") ...[
+          const SizedBox(
+            height: 8,
+          ),
+          CommonChip(
+            avatar: const Icon(Icons.sync),
+            label: appLocalizations.sync,
+            onPressed: () {
+              _handleUpdateProfile();
+            },
+          ),
+        ],
+      ],
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return ListItem(
+      padding: const EdgeInsets.symmetric(
+        horizontal: 16,
+        vertical: 4,
+      ),
+      title: Text(provider.name),
+      subtitle: _buildSubtitle(),
+      trailing: SizedBox(
+        height: 48,
+        width: 48,
+        child: ValueListenableBuilder(
+          valueListenable: isUpdating,
+          builder: (_, isUpdating, ___) {
+            return FadeBox(
+              child: isUpdating
+                  ? const Padding(
+                      padding: EdgeInsets.all(8),
+                      child: CircularProgressIndicator(),
+                    )
+                  : const SizedBox(),
+            );
+          },
+        ),
+      ),
+    );
+  }
+}
+
+class UpdateGeoUrlFormDialog extends StatefulWidget {
+  final String title;
+  final String url;
+
+  const UpdateGeoUrlFormDialog({
+    super.key,
+    required this.title,
+    required this.url,
+  });
+
+  @override
+  State<UpdateGeoUrlFormDialog> createState() => _UpdateGeoUrlFormDialogState();
+}
+
+class _UpdateGeoUrlFormDialogState extends State<UpdateGeoUrlFormDialog> {
+  late TextEditingController urlController;
+
+  @override
+  void initState() {
+    super.initState();
+    urlController = TextEditingController(text: widget.url);
+  }
+
+  _handleUpdate() async {
+    final url = urlController.value.text;
+    if (url.isEmpty) return;
+    Navigator.of(context).pop<String>(url);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      title: Text(widget.title),
+      content: SizedBox(
+        width: 300,
+        child: Wrap(
+          runSpacing: 16,
+          children: [
+            TextField(
+              maxLines: 5,
+              minLines: 1,
+              controller: urlController,
+              decoration: const InputDecoration(
+                border: OutlineInputBorder(),
+              ),
+            ),
+          ],
+        ),
+      ),
+      actions: [
+        TextButton(
+          onPressed: _handleUpdate,
+          child: Text(appLocalizations.submit),
+        )
+      ],
+    );
+  }
+}

lib/fragments/theme.dart

@@ -1,3 +1,5 @@
+import 'dart:ui';
+
 import 'package:fl_clash/common/common.dart';
 import 'package:fl_clash/models/models.dart';
 import 'package:fl_clash/state.dart';
@@ -21,8 +23,95 @@ class ThemeModeItem {
 class ThemeFragment extends StatelessWidget {
   const ThemeFragment({super.key});
 
-  Widget _themeModeCheckBox({
+  Widget _itemCard({
     required BuildContext context,
+    required Info info,
+    required Widget child,
+  }) {
+    return Padding(
+      padding: const EdgeInsets.only(
+        top: 16,
+      ),
+      child: Wrap(
+        runSpacing: 16,
+        children: [
+          InfoHeader(
+            info: info,
+          ),
+          child,
+        ],
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final previewCard = Padding(
+      padding: const EdgeInsets.symmetric(horizontal: 16),
+      child: CommonCard(
+        onPressed: (){
+
+        },
+        info: Info(
+          label: appLocalizations.preview,
+          iconData: Icons.looks,
+        ),
+        child: Container(
+          height: 200,
+        ),
+      ),
+    );
+    return SingleChildScrollView(
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          previewCard,
+          const ThemeColorsBox(),
+        ],
+      ),
+    );
+  }
+}
+
+class ItemCard extends StatelessWidget {
+  final Widget child;
+  final Info info;
+
+  const ItemCard({
+    super.key,
+    required this.info,
+    required this.child,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.only(
+        top: 16,
+      ),
+      child: Wrap(
+        runSpacing: 16,
+        children: [
+          InfoHeader(
+            info: info,
+          ),
+          child,
+        ],
+      ),
+    );
+  }
+}
+
+class ThemeColorsBox extends StatefulWidget {
+  const ThemeColorsBox({super.key});
+
+  @override
+  State<ThemeColorsBox> createState() => _ThemeColorsBoxState();
+}
+
+class _ThemeColorsBoxState extends State<ThemeColorsBox> {
+
+  Widget _themeModeCheckBox({
     bool? isSelected,
     required ThemeModeItem themeModeItem,
   }) {
@@ -32,7 +121,7 @@ class ThemeFragment extends StatelessWidget {
         globalState.appController.config.themeMode = themeModeItem.themeMode;
       },
       child: Padding(
-        padding: const EdgeInsets.symmetric(horizontal:16),
+        padding: const EdgeInsets.symmetric(horizontal: 16),
         child: Row(
           mainAxisSize: MainAxisSize.min,
           mainAxisAlignment: MainAxisAlignment.start,
@@ -55,7 +144,6 @@ class ThemeFragment extends StatelessWidget {
   }
 
   Widget _primaryColorCheckBox({
-    required BuildContext context,
     bool? isSelected,
     Color? color,
   }) {
@@ -68,28 +156,8 @@ class ThemeFragment extends StatelessWidget {
     );
   }
 
-  Widget _itemCard({
+  @override
-    required BuildContext context,
+  Widget build(BuildContext context) {
-    required Info info,
-    required Widget child,
-  }) {
-    return Padding(
-      padding: const EdgeInsets.only(
-        top: 16,
-      ),
-      child: Wrap(
-        runSpacing: 16,
-        children: [
-          InfoHeader(
-            info: info,
-          ),
-          child,
-        ],
-      ),
-    );
-  }
-
-  Widget _getThemeCard(BuildContext context) {
     List<ThemeModeItem> themeModeItems = [
       ThemeModeItem(
         iconData: Icons.auto_mode,
@@ -118,8 +186,7 @@ class ThemeFragment extends StatelessWidget {
     ];
     return Column(
       children: [
-        _itemCard(
+        ItemCard(
-          context: context,
           info: Info(
             label: appLocalizations.themeMode,
             iconData: Icons.brightness_high,
@@ -137,7 +204,6 @@ class ThemeFragment extends StatelessWidget {
                     final themeModeItem = themeModeItems[index];
                     return _themeModeCheckBox(
                       isSelected: themeMode == themeModeItem.themeMode,
-                      context: context,
                       themeModeItem: themeModeItem,
                     );
                   },
@@ -151,8 +217,7 @@ class ThemeFragment extends StatelessWidget {
             },
           ),
         ),
-        _itemCard(
+        ItemCard(
-          context: context,
           info: Info(
             label: appLocalizations.themeColor,
             iconData: Icons.palette,
@@ -172,7 +237,6 @@ class ThemeFragment extends StatelessWidget {
                   itemBuilder: (_, index) {
                     final primaryColor = primaryColors[index];
                     return _primaryColorCheckBox(
-                      context: context,
                       isSelected: currentPrimaryColor == primaryColor?.value,
                       color: primaryColor,
                     );
@@ -191,30 +255,4 @@ class ThemeFragment extends StatelessWidget {
       ],
     );
   }
-
-  @override
-  Widget build(BuildContext context) {
-    final themeCard = _getThemeCard(context);
-    final previewCard = Padding(
-      padding: const EdgeInsets.symmetric(horizontal: 16),
-      child: CommonCard(
-        info: Info(
-          label: appLocalizations.preview,
-          iconData: Icons.looks,
-        ),
-        child: Container(
-          height: 200,
-        ),
-      ),
-    );
-    return SingleChildScrollView(
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
-        children: [
-          previewCard,
-          themeCard,
-        ],
-      ),
-    );
-  }
 }

lib/fragments/tools.dart

@@ -57,138 +57,120 @@ class _ToolboxFragmentState extends State<ToolsFragment> {
     return Intl.message(locale.toString());
   }
 
-  Widget _getOtherList() {
+  List<Widget> _getOtherList() {
-    List<Widget> items = [
+    return generateSection(
-      ListItem.open(
+      title: appLocalizations.other,
-        leading: const Icon(Icons.info),
+      items: [
-        title: Text(appLocalizations.about),
+        ListItem.open(
-        delegate: OpenDelegate(
+          leading: const Icon(Icons.info),
-          title: appLocalizations.about,
+          title: Text(appLocalizations.about),
-          widget: const AboutFragment(),
+          delegate: OpenDelegate(
+            title: appLocalizations.about,
+            widget: const AboutFragment(),
+          ),
         ),
-      ),
-    ];
-    return Column(
-      mainAxisSize: MainAxisSize.min,
-      children: [
-        for (final item in items) ...[
-          item,
-          if (item != items.last)
-            const Divider(
-              height: 0,
-            ),
-        ]
       ],
     );
   }
 
-  Widget _getSettingList() {
+  List<Widget> _getSettingList() {
-    List<Widget> items = [
+    return generateSection(
-      Selector<Config, String?>(
+      title: appLocalizations.settings,
-        selector: (_, config) => config.locale,
+      items: [
-        builder: (_, localeString, __) {
+        Selector<Config, String?>(
-          final subTitle = localeString ?? appLocalizations.defaultText;
+          selector: (_, config) => config.locale,
-          final currentLocale = other.getLocaleForString(localeString);
+          builder: (_, localeString, __) {
-          return ListTile(
+            final subTitle = localeString ?? appLocalizations.defaultText;
-            leading: const Icon(Icons.language_outlined),
+            final currentLocale = other.getLocaleForString(localeString);
-            title: Text(appLocalizations.language),
+            return ListTile(
-            subtitle: Text(Intl.message(subTitle)),
+              leading: const Icon(Icons.language_outlined),
-            onTap: () {
+              title: Text(appLocalizations.language),
-              globalState.showCommonDialog(
+              subtitle: Text(Intl.message(subTitle)),
-                child: AlertDialog(
+              onTap: () {
-                  title: Text(appLocalizations.language),
+                globalState.showCommonDialog(
-                  contentPadding: const EdgeInsets.symmetric(
+                  child: AlertDialog(
-                    horizontal: 8,
+                    title: Text(appLocalizations.language),
-                    vertical: 16,
+                    contentPadding: const EdgeInsets.symmetric(
-                  ),
+                      horizontal: 8,
-                  content: SizedBox(
+                      vertical: 16,
-                    width: 250,
+                    ),
-                    child: Wrap(
+                    content: SizedBox(
-                      children: [
+                      width: 250,
-                        for (final locale in [
+                      child: Wrap(
-                          null,
+                        children: [
-                          ...AppLocalizations.delegate.supportedLocales
+                          for (final locale in [
-                        ])
+                            null,
-                          ListItem.radio(
+                            ...AppLocalizations.delegate.supportedLocales
-                            delegate: RadioDelegate<Locale?>(
+                          ])
-                              value: locale,
+                            ListItem.radio(
-                              groupValue: currentLocale,
+                              delegate: RadioDelegate<Locale?>(
-                              onChanged: (Locale? value) {
+                                value: locale,
-                                final config = context.read<Config>();
+                                groupValue: currentLocale,
-                                config.locale = value?.toString();
+                                onChanged: (Locale? value) {
-                                Navigator.of(context).pop();
+                                  final config = context.read<Config>();
-                              },
+                                  config.locale = value?.toString();
-                            ),
+                                  Navigator.of(context).pop();
-                            title: Text(_getLocaleString(locale)),
+                                },
-                          )
+                              ),
-                      ],
+                              title: Text(_getLocaleString(locale)),
+                            )
+                        ],
+                      ),
                     ),
                   ),
-                ),
+                );
-              );
+              },
-            },
+            );
-          );
+          },
-        },
-      ),
-      ListItem.open(
-        leading: const Icon(Icons.style),
-        title: Text(appLocalizations.theme),
-        subtitle: Text(appLocalizations.themeDesc),
-        delegate: OpenDelegate(
-          title: appLocalizations.theme,
-          widget: const ThemeFragment(),
-          extendPageWidth: 360,
         ),
-      ),
-      ListItem.open(
-        leading: const Icon(Icons.cloud_sync),
-        title: Text(appLocalizations.backupAndRecovery),
-        subtitle: Text(appLocalizations.backupAndRecoveryDesc),
-        delegate: OpenDelegate(
-          title: appLocalizations.backupAndRecovery,
-          widget: const BackupAndRecovery(),
-        ),
-      ),
-      if (Platform.isAndroid)
         ListItem.open(
-          leading: const Icon(Icons.view_list),
+          leading: const Icon(Icons.style),
-          title: Text(appLocalizations.accessControl),
+          title: Text(appLocalizations.theme),
-          subtitle: Text(appLocalizations.accessControlDesc),
+          subtitle: Text(appLocalizations.themeDesc),
           delegate: OpenDelegate(
-            title: appLocalizations.appAccessControl,
+            title: appLocalizations.theme,
-            widget: const AccessFragment(),
+            widget: const ThemeFragment(),
+            extendPageWidth: 360,
           ),
         ),
-      ListItem.open(
+        ListItem.open(
-        leading: const Icon(Icons.edit),
+          leading: const Icon(Icons.cloud_sync),
-        title: Text(appLocalizations.override),
+          title: Text(appLocalizations.backupAndRecovery),
-        subtitle: Text(appLocalizations.overrideDesc),
+          subtitle: Text(appLocalizations.backupAndRecoveryDesc),
-        delegate: OpenDelegate(
+          delegate: OpenDelegate(
-          title: appLocalizations.override,
+            title: appLocalizations.backupAndRecovery,
-          widget: const ConfigFragment(),
+            widget: const BackupAndRecovery(),
-          extendPageWidth: 360,
+          ),
         ),
-      ),
+        if (Platform.isAndroid)
-      ListItem.open(
+          ListItem.open(
-        leading: const Icon(Icons.settings_applications),
+            leading: const Icon(Icons.view_list),
-        title: Text(appLocalizations.application),
+            title: Text(appLocalizations.accessControl),
-        subtitle: Text(appLocalizations.applicationDesc),
+            subtitle: Text(appLocalizations.accessControlDesc),
-        delegate: OpenDelegate(
+            delegate: OpenDelegate(
-          title: appLocalizations.application,
+              title: appLocalizations.appAccessControl,
-          widget: const ApplicationSettingFragment(),
+              widget: const AccessFragment(),
-        ),
-      ),
-    ];
-    return Column(
-      mainAxisSize: MainAxisSize.min,
-      children: [
-        for (final item in items) ...[
-          item,
-          if (item != items.last)
-            const Divider(
-              height: 0,
             ),
-        ]
+          ),
+        ListItem.open(
+          leading: const Icon(Icons.edit),
+          title: Text(appLocalizations.override),
+          subtitle: Text(appLocalizations.overrideDesc),
+          delegate: OpenDelegate(
+            title: appLocalizations.override,
+            widget: const ConfigFragment(),
+            extendPageWidth: 360,
+          ),
+        ),
+        ListItem.open(
+          leading: const Icon(Icons.settings_applications),
+          title: Text(appLocalizations.application),
+          subtitle: Text(appLocalizations.applicationDesc),
+          delegate: OpenDelegate(
+            title: appLocalizations.application,
+            widget: const ApplicationSettingFragment(),
+          ),
+        ),
       ],
     );
   }
@@ -216,20 +198,16 @@ class _ToolboxFragmentState extends State<ToolsFragment> {
               if (state.navigationItems.isEmpty) {
                 return Container();
               }
-              return Section(
+              return Column(
-                title: appLocalizations.more,
+                children: [
-                child: _buildNavigationMenu(state.navigationItems),
+                  ListHeader(title: appLocalizations.more),
+                  _buildNavigationMenu(state.navigationItems)
+                ],
               );
             },
           ),
-          Section(
+          ..._getSettingList(),
-            title: appLocalizations.settings,
+          ..._getOtherList(),
-            child: _getSettingList(),
-          ),
-          Section(
-            title: appLocalizations.other,
-            child: _getOtherList(),
-          ),
         ];
         return ListView.builder(
           itemCount: items.length,