Adobe Air-顯示對話框時如何使背景變暗（標題窗口）

Question

可以說我有以下mxml：

<view...>

  <s:VGroup width="100%" height="100%">
      <s:Button label="some label"/>
      <s:Button label="some other label"/>
      <s:Button label="yet another label"/>
      <s:Button label="one last label"/>
  </s:VGroup>

  <s:TitleWindow includeIn="abandon" id="dlgAbandon" title="Question">
        <s:VGroup horizontalAlign="center" paddingTop="8" paddingBottom="8" paddingLeft="20" paddingRight="20" gap="10" width="100%" height="100%">
            <s:Label text="Why?" color="{Constants.ChromeColor}" fontWeight="bold"/>
            <s:VGroup width="100%" gap="10">
                <s:Button label="reason 1" width="100%" id="btnR1"  click="onDlgWhyNotClose('reason 1')"/>
                <s:Button label="reason 2" width="100%" id="btnR1"  click="onDlgWhyNotClose('reason 2')"/>
                <s:Button label="reason 3" width="100%" id="btnR1"  click="onDlgWhyNotClose('reason 3')"/>
            </s:VGroup>
        </s:VGroup>
    </s:TitleWindow>

</view>

現在，在我的代碼中，將currentState更改為“ abandon”，這樣該對話框將顯示在VGroup的頂部。

如何使對話框后面的背景（VGroup中的所有內容，甚至父視圖的所有內容）變暗？ 對話框關閉時如何取消顯示？

謝謝 ：-）

阿維

Answer 1

一種快速的解決方案是為此狀態添加半透明背景，例如

<view...>

<s:VGroup width="100%" height="100%">
  <s:Button label="some label"/>
  <s:Button label="some other label"/>
  <s:Button label="yet another label"/>
  <s:Button label="one last label"/>
</s:VGroup>

<s:SkinnableContainer includeIn="abandon" 
                      width="100%"
                      height="100%"
                      backgroundColor="#000000"
                      backgroundAlpha="0.3">

    <s:TitleWindow id="dlgAbandon" title="Question">
        <s:VGroup horizontalAlign="center" paddingTop="8" paddingBottom="8" paddingLeft="20" paddingRight="20" gap="10" width="100%" height="100%">
        <s:Label text="Why?" color="{Constants.ChromeColor}" fontWeight="bold"/>
            <s:VGroup width="100%" gap="10">
                <s:Button label="reason 1" width="100%" id="btnR1"  click="onDlgWhyNotClose('reason 1')"/>
                <s:Button label="reason 2" width="100%" id="btnR1"  click="onDlgWhyNotClose('reason 2')"/>
                <s:Button label="reason 3" width="100%" id="btnR1"  click="onDlgWhyNotClose('reason 3')"/>
            </s:VGroup>
        </s:VGroup>
    </s:TitleWindow>

</s:SkinnableContainer>

</view>

請注意，現在SkinnableContainer包含在放棄狀態中，而不僅僅是TitleWindow