املأ Hox من اليمين؟ Vbox من أسفل؟

Question

أنا فقط بحاجة إلى إجابة Hox فقط ولكن رقم أنه إذا حصلنا على إجابة جيدة هنا ، فسيساعد أي شخص على محاولة القيام بشيء مماثل مع Vbox. سيكون من الجيد معرفة ذلك في كل من ActionScript و MXML.

لذلك لدي hbox أريد محاذاة بعض النص من اليسار وبعض أجهزة الراديو من اليمين. مثل ذلك:

 ___________________________________________________
|                                                   |
|Text                                Yes ()  No()   |
|___________________________________________________|

أقوم بذلك حاليًا عن طريق وجود صندوق غير مرئي بعرض 100 ٪ بين النص وراديو ، مثل هذا

 _____ __________________________________ ________________
|     |                                  |                |
|Text | invisible box  percentWidth=100; | Yes ()  No()   |
|_____|__________________________________|________________|

أفضل فقط أن يكون لدي أجهزة الراديو في Hox الخاصة بها محاذاة مناسبة مثل هذا:

 _____ ________________________________________________________
|     |                                                        |
|Text |                                         Yes ()  No()   |
|_____|________________________________________________________|

لقد رأيت بعض المنشورات تتحدث عن خاصية أفقية ، لكنني لا أراها في الوثائق في أي مكان.

فكيف يمكنني إنجاز هذا؟

شكرا ~ مايك

Answer 1

هناك horizontalAlign الممتلكات ، و verticalAlign الخاصية ، على مكونات Vbox و Hbox (موروثة من المربع). يحددون المحاذاة الأفقية والرأسية لأطفال المكون.

أنا عادة ما أستخدم كائن الفاصل ، مثل ذكر سام. ولكن لما تريد القيام به ، فإن هذا سيعمل بشكل رائع.

في MXML يمكنك أن تفعل شيئًا مثل:

<mx:RadioButtonGroup id="yesNoRadioGroup"/>

<mx:HBox id="containingHBox" width="100%">
    <mx:Text id="textElement" width="200" text="lakdfa lkadslkjraklnd kadflk lakdsjlkja lksdlkjdflk jalkdlkjdfslksajdf lkjasdflkjdsalkjds lksdjlkj"/>
    <mx:HBox id="rightAlignedHorizontalContent" width="100%" horizontalAlign="right">
        <mx:RadioButton id="yesRadio" label="Yes" groupName="yesNoRadioGroup"/>
        <mx:RadioButton id="noRadio" label="No" groupName ="yesNoRadioGroup"/>
    </mx:HBox>
</mx:HBox>

لاحظ أن Hox مع horizontalAlign يجب أن يكون للمجموعة قيمة عرض ، وإلا ، فإنها ستكون واسعة فقط بما يكفي لاستيعاب عرض أطفالها ، وفي هذه الحالة تكون المحاذاة نقاشًا.

إليك نسخة كـ:

<mx:Script>
    <![CDATA[
        import mx.controls.RadioButton;
        import mx.controls.RadioButtonGroup;
        import mx.controls.Text;

        private var containingHBox:HBox;
        private var textElement:Text;
        private var rightAlignedHorizontalContent:HBox;
        private var yesNoRadioGroup:RadioButtonGroup; 
        private var yesRadio:RadioButton;
        private var noRadio:RadioButton;

        override protected function createChildren():void
        {
            super.createChildren();

            containingHBox = new HBox();
            containingHBox.percentWidth = 100;

            textElement = new Text();
            textElement.width = 200;
            textElement.text = "lakdfa lkadslkjraklnd kadflk lakdsjlkja lksdlkjdflk jalkdlkjdfslksajdf lkjasdflkjdsalkjds lksdjlkj";

            rightAlignedHorizontalContent = new HBox();
            rightAlignedHorizontalContent.percentWidth = 100;
            rightAlignedHorizontalContent.setStyle("horizontalAlign","right");

            yesNoRadioGroup = new RadioButtonGroup();

            yesRadio = new RadioButton();
            yesRadio.label = "Yes";
            yesRadio.groupName = "yesNoRadioGroup";

            noRadio = new RadioButton();
            noRadio.label = "No";
            noRadio.groupName = "yesNoRadioGroup";


            addChild(containingHBox);

            containingHBox.addChild(textElement);
            containingHBox.addChild(rightAlignedHorizontalContent);

            rightAlignedHorizontalContent.addChild(yesRadio);
            rightAlignedHorizontalContent.addChild(noRadio);
        }
    ]]>
</mx:Script>

Answer 2

إذا كنت تستخدم بالفعل Hox/Vbox لتخطيطك ، فإن استخدام الفاصل هو الطريقة الصحيحة للذهاب لنقل بعض العناصر إلى اليمين/أسفل.

البديل هو التصميم القائم على القيد. هذا أمر جيد عندما تريد ترسيخ المحتوى إلى اليسار ، يمكنك استخدام قماش كأم وعلى الطفل تعيين "Right = '0'" لوضعه على طول الطريق إلى اليمين. هذا أقل مثالية عند تكديس عناصر متعددة بناءً على حجمها. يمكنك استخدام الربط ، "right = '{nocomponent.width}" لوضع نعم على يمين رقم