前言¶

DeepSeek Harness（DSH）的 Web 客戶端在桌面寬屏下佈局已經比較成熟；若你在手機豎屏瀏覽器或 Android 殼裏打開同一套界面，左側欄、輸入區和工具條往往擠在一屏裏，單手操作成本高。自己改官方佈局插件或 fork 內核，升級和維護成本都偏高。

下面介紹社區維護者 XiaoPb 發佈的 Cordis 客戶端插件 @xiaopb/dsh-mobile-layout：只在手機豎屏下切換爲觸控向佈局，橫屏、平板與桌面保持官方默認，且不替換官方佈局插件、不修改內核。

這是什麼¶

@xiaopb/dsh-mobile-layout 歸類爲 DSH 客戶端插件，面向 Web profile。它通過 Cordis 注入客戶端腳本（發佈物爲單文件 lib/client.js），在識別到手機豎屏形態時給頁面加上 data-dshm-mode="mobile" 作用域內的樣式與交互；錨點失敗或卸載插件時回退官方佈局。

插件在 SkillHub 目錄 可檢索，源碼與文檔在 GitHub：XiaoPb/dsh-mobile-layout。package.json 中聲明的 DSH 兼容下限爲 >=0.2.1-rc.2，許可證爲 MIT。

核心功能¶

形態識別與零侵入¶

插件識別三種宿主：Android 殼、桌面 Electron、瀏覽器。桌面端 DeepSeek Harness 永不激活該佈局；其餘形態僅在手機豎屏下生效，橫屏與桌面像素級保持官方原樣。樣式與邏輯受 html[data-dshm-mode="mobile"] 作用域保護，卸載或注入失敗即回退。

抽屜式左側欄¶

官方左側欄在手機豎屏下改爲抽屜：屏幕左側約 60% 區域右滑打開，支持跟手拖拽與鬆手吸附；遮罩或左滑關閉。入口爲手勢、無額外按鍵，避免遮擋子頁返回鍵；手勢在 window 捕獲階段常駐。僅在真正換頁時自動收起，點空白、搜索、賬號菜單等不會誤關。

底部操作條與加號面板¶

輸入區上方常駐約 56px 高的操作條：新建、會話、文件、圖片、插件、更多。加號面板與軟鍵盤採用揭開 / 覆蓋式切換，開合帶動畫（系統「減少動態效果」時跳過）。面板爲 4 列 × 2 行宮格，超過 8 項可橫向分頁；圖標按功能類型哈希配色（藍 / 橙 / 紫 / 綠等檔位）。

會話與插件面板¶

按工作區分組、吸頂標題、相對時間，高度最多約佔屏高 64%。頂部把手下拉即關，視覺對齊官方彈層規範。輸入區與底部面板融合：去圓角 / 邊框 / 陰影、全寬同表面；權限與模型短名 chip 留在輸入行（「完全訪問」恆標紅，中英文均識別）。

設置頁與選擇器¶

設置頁改爲全屏：品牌行、可橫滑頁籤、返回鍵；內容區橫滑切換頁籤。模型 / 權限二級菜單改爲貼底列表，選中態用主題藍；空態打開選擇器時不自動彈軟鍵盤（點搜索框仍可輸入）。

浮層互斥¶

抽屜、底部表、加號面板互斥，按層序逐層關閉；加號面板與輸入法雙向互斥（開面板先收鍵盤，面板開着點輸入框先收面板再拉起鍵盤）。

三套佈局預設¶

在 設置 → 通用設置 → 外觀 下的「佈局模式」中一鍵切換，即時生效、三檔可雙向切換且不殘留：

1. 原生：整體交還官方佈局；官方設置彈窗改爲居中懸浮窗（左右等寬、上下約 10% 視口留白，小屏保底、大屏封頂）。
2. 融合：輸入區與底欄連成一整條；空態虛線輸入卡左右留白對稱。
3. 懸浮：手機應用形態——底部五項導航（會話 / 自動化任務 / 插件 / 工作臺 / 設置）、輸入卡懸浮、加號面板改爲一 / 二級菜單；工作臺開關官方右側面板；透明底欄；可用 CSS 變量 --dshm-engine-bar（默認 56px）爲宿主「引擎已就緒」狀態條讓位，習慣先收起可設爲 0px。

插件自繪 UI 文案隨官方語言實時刷新；支持 aria-modal、焦點管理與動效降級。

幾何量通過 html[data-dshm-form="phone"] 下的 CSS 變量與 env(safe-area-inset-*) 適配多機型，可在用戶樣式中覆蓋，例如 --dshm-settings-gutter、--dshm-classic-gutter、--dshm-v2-nav 等（完整表格見倉庫 README）。

安裝與啓用¶

在已配置 Web profile 的 DSH 環境中，使用資料原文給出的命令安裝：

dsh plugin --profile web add @xiaopb/dsh-mobile-layout

安裝後客戶端會按 cordis.patch.yml 注入 @deepseek-ai/dsh-client-runtime 與 @deepseek-ai/dsh-client-ui-layout 相關客戶端 bundle。插件以當前 DSH 進程權限運行，安裝前應閱讀倉庫源碼與 MIT 許可證，確認符合你的安全與合規要求。

典型用法¶

1. 安裝插件後，用手機豎屏打開 DSH Web 客戶端（或 Android 殼內的 Web 視圖），確認左側欄可通過邊緣右滑以抽屜形式打開。
2. 在輸入區上方使用底欄快捷入口；點「更多」或加號區域展開面板，需要輸入時注意面板與鍵盤的互斥行爲。
3. 進入 設置 → 通用設置 → 外觀 → 佈局模式，在原生 / 融合 / 懸浮三張卡片間切換，按習慣選擇單手或「應用式」導航。
4. 若懸浮模式下頂部被宿主引擎狀態條佔用，可在自定義 CSS 中調整 --dshm-engine-bar。
5. 桌面 Electron 或寬屏瀏覽器下無需關閉插件：佈局保持官方默認，便於同一套 profile 多端共用。

更細的預設截圖與頁面說明見倉庫 docs/preset-default.md、docs/preset-classic.md、docs/preset-v2.md 及架構文檔 docs/architecture.md。

適用場景與注意¶

適合：經常在手機豎屏使用 DSH Web 客戶端、希望抽屜側欄、底欄快捷入口與可選「懸浮」導航，且不想改官方內核或替換官方 layout 插件的開發者與用戶。

注意：

• 僅手機豎屏激活；橫屏、平板、桌面不受影響。
• 社區目錄 SkillHub 爲獨立站點，與 DeepSeek / 幻方無官方從屬關係；插件非官方出品，星標與版本以目錄頁與 npm 爲準。
• 依賴 Cordis 與聲明的 DSH 版本下限，升級 DSH 後若佈局異常，應對照倉庫 dsh.compatibility 與 CHANGELOG。

結尾¶

@xiaopb/dsh-mobile-layout 把 DSH Web 在手機豎屏下的側欄、輸入區與常用操作收成觸控向佈局，並通過三套預設與 CSS 變量保留可調空間，同時堅持桌面與橫屏官方原樣。需要安裝命令與變量表時直接查閱倉庫 README；目錄頁 SkillHub，源碼 GitHub。