【新特性速遞】平鋪數字輸入框的觸發圖示(NumberBoxTriggerType)

三生石上(FineUI控制元件)發表於2020-09-17

FineUIPro/Mvc/Core的下個版本(v7.0.0),我們允許平鋪顯示數字輸入框的觸發圖示。

 

之前有網友抱怨說數字輸入框的觸發圖示太小了,不好點選,能不能將觸發圖示平鋪展示呢?

答案是可行的。

 

新版本新增了一個NumberBoxTriggerType列舉型別,支援幾種不同的展示方式:

public enum NumberBoxTriggerType
{
	/// <summary>
	/// 上下層疊
	/// </summary>
	Stack,
	/// <summary>
	/// 平鋪
	/// </summary>
	Tile,
	/// <summary>
	/// 左右分開
	/// </summary>
	Separate
}

其中NumberBoxTriggerType.Stack就是預設的展示方式。

 

下面透過示例看下這幾種展示方式的效果:

<f:NumberBox Label="Stack" ID="NumberBox1" NoDecimal="true" NoNegative="true" TriggerType="Stack" Text="100" runat="server" />
<f:NumberBox Label="Tile" ID="NumberBox2" NoDecimal="true" NoNegative="true" TriggerType="Tile" Text="20" runat="server" />
<f:NumberBox Label="None" ID="NumberBox3" NoDecimal="true" NoNegative="true" ShowTrigger="false" Text="20" runat="server" />
<f:NumberBox Label="Separate" ID="NumberBox4" CssClass="text-align-center" NoDecimal="true" NoNegative="true" TriggerType="Separate" Width="180px" Text="1" runat="server" />

如果不需要觸發圖示,只需設定ShowTrigger=false即可。

【新特性速遞】平鋪數字輸入框的觸發圖示(NumberBoxTriggerType)  

  

 

歡迎入夥:https://fineui.com/fans/

三石出品,必屬精品 

相關文章