我正在 flex 中开发一个仪表板应用程序,它是flex 仪表板的副本。这里有多个面板显示不同的内容。我想要的是每当用户点击任何特定面板说例如“年度收入”时,我只想突出显示该特定面板。
所以基本上所有处于初始状态的面板都处于“非活动”状态,但是一旦用户点击它,它就会变为活动状态,为用户提供更好的体验,因为他知道他正在使用“xyz”面板,其余的会进入非活动状态。
所以我所说的“活动”和“非活动”状态是指,在任何 HTML 页面中,当我们将鼠标悬停在任何超链接上时,它会变为“蓝色”(例如),因此我将其称为活动和非活动状态。
现在,谈论面板。
该面板具有定义其布局的皮肤。为了满足我的要求,我尝试将“css”应用于面板。现在我以这种方式应用了css
public class Pod extends Panel
{
...properties
public function init():void
{
setStyle('styleName',"panelOff");
}
}
现在,在这个类本身中,我正在处理面板上的“CLICK”。所以在点击事件中我所做的基本上是,
setStyle('styleName',"panelOn");
由于面板正在应用皮肤,因此我需要更改皮肤中包含的组件的属性。这样我必须能够访问皮肤中的 css 属性。
在皮肤文件中我正在做这样的事情
override protected function updateDisplayList(unscaledWidth:Number,
unscaledHeight:Number):void
{
setStyle('border-alpha', hostComponent.getStyle('border-alpha'));
}
所以我的问题是,这是满足我要求的正确方法吗?
如何访问皮肤类中主机组件的 css 属性?
在我的 main.mxml 中,我定义了样式文件。因此,如果样式文件包含一个名为“panelOn”的样式类,并且如果我将该类提供给面板,那么它将能够访问与该类关联的样式吗?
请不要建议使用面板的 setStyle 方法放置每个 css 属性,因为这样对我来说使用 css 文件没有任何优势,而且 css 样式也会很糟糕。
如果还有其他更好的解决方案,请分享您的意见。我希望我很清楚。任何帮助将不胜感激。