在Axure8和9中，有一個設定叫做“自動适應文本寬度（Fit to Text Width）”，然而實際用起來可能會出現一些問題。本文分享了一個實作Axure8和9的“自動适應文本寬度”的方法，一起來看一下吧。
在Axure8和9中，有一個設定叫做“自動适應文本寬度（Fit to Text Width）”，不過大家發現其實隻在設計時有用，在預覽時完全沒有效果，而且放在中繼器中還會出現資料變動時統一寬度的問題。
一、現狀
網上目前的解決方法有用等寬字型的，有用字數乘固定值14px的……但隻能解決部分問題，對于富文本或者中英文混和文本無能為力。雖然Axure10已經支援，但是很多人還在用Axure8和9，是以這裡教大家一個完美的方案。
示範：
二、準備
首先，我們要先做一把“尺”，方法如下：
第1步：拖出一個“動态面闆”，将其命名為“ruler”；
第2步：将“ruler”設定為“水準滾動”并取消“自動适應文本寬度”；
第3步：将“ruler”設定為 19999px寬（必須） 和 50px高（随意）。
第4步：拖出一個“文本标簽（Label）”，命名為“scale”；
第5步：将“scale”設定為：
第6步 删除所有字元并單擊“自動适應文本寬度”，它會自動變為 1px 寬度。
好了，這把“尺”就快完成了。
三、測試
第1步：拖出“矩形 1（Box 1）”，将其命名為“box no padding”，并将左右填充設定為 0px；
第2步：将“scale”和“box no padding”設定為相同的字型、相同的字型樣式、相同的字型大小；
第3步：拖出“文本字段”；
第4步：添加“文本改變時”互動。
預覽一下，在文本輸入随便中英文甚至其他語言，都可以，文章後面有檔案下載下傳。
最驚奇的在于：它在中繼器中也能用并且很好用。
四、使用方法
您隻需要做三件事：
- 将文本設定到“scale”裡
- 滾動到“scale”元件
- 将“box”設定為新大小（标尺.scrollX + box.padding ）
隻要保證你的文字元件的字型、樣式、大小、内容與“尺”裡的一模一樣就可以。
五、檔案下載下傳及預覽
Axure 8&9示範檔案：
ruler_RP9.rp（78.5 KB）
ruler_RP8.rp（87.2 KB）
預覽：
預告：
後面會出一個中繼器實時拖放的教程，比如手機圖示整理：
敬請期待。
本文由 @最InのAxure 原創釋出于人人都是産品經理，未經許可，禁止轉載
題圖來自 Unsplash，基于 CC0 協定
該文觀點僅代表作者本人，人人都是産品經理平台僅提供資訊存儲空間服務。