Flex clipContent 編程注意_Flex

來源:互聯網
上載者:User

現在需要的一個這樣的方式,用滑鼠對C進行Drag操作。使它可以在A中任意移動,但是由於C是包含在B中,因此使用startDrag() 和 stopDrag()的時候,只能在B地區中進行移動,而無法超出B的邊界。
如果我們想讓C在A中移動的話,那麼就應該使用一個叫做clipContent的屬性了。

以下是這個屬性的定義:
Whether to apply a clip mask if the positions and/or sizes of this container's children extend outside the borders of this container.

它的中文含義大致是:
如果此容器的子項的位置和/或大小擴充到此容器的邊框之外,是否應用剪裁遮罩。

clipContent值:
True:當子項目的邊界超出此容器時,不顯示子項目在此容器中。
Flase:當子項目的邊界超出此容器時,顯示子項目在此容器中。

clipContent是Container中的一個public propertie。因此Flex常用的一些容器類控制項:
Accordion, Box, Canvas, Form, FormItem, LayoutContainer, Panel, Tile, ViewStack 全部都可以使用這個屬性。

即我們在B中,設定clipContent = false,這樣就可以實現我們的要的效果了,當C在移動的時候,如果遇到了D,則會在D的下面,那麼這是怎麼回事呢?
因為在coding這個結構的時候,D的z-index就比B的高,因此C移動的時候,會被D遮擋住(雖然C可以在A中任意位置進行移動)

所以我們做如下的設定:
將B的z-index,放置到D的z-index上面即可。而我們使用的方式就是:setChildIndex(這個method是很常用的,因此我就不在這裡進行複述了。)

因此如果在一個很複雜的嵌套的容器中,如果要移動其中一個子容器在最外層容器中時,應作如下的設定:
1、將要移動的子容器的父容器(當然這個父容器之上可能還會有父容器的)要在需要移動容器中處於最上層顯示。
例如:A → B → C → D → E
F→ G → H
如果想要移動E在A中,那麼就需要B在F的上面,即使用setChildIndex來重新設定B與F的位置。
2、需要將D容器的clipContent設定為false。

以上,希望會對大家有所協助:)

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.