Flashforum - Die Community zu Adobe Flash, Flex AIR. Web Design und Inspiration.

Janoscharlipp · 03-09-2008, 12:37

Moin,
ich versuche verzweifelt, ein Panel mit prozentualer Höhe dazu zu bringen, eine ScrollBar einzublenden, falls sein Inhalt zu groß ist.
Statt dessen passt sich bei mir immer das Panel an seinen Inhalt an, und erst die Application bietet dann die Scrollbar.
Prozentuale Höhe muss sein, damit es sich in der Höhe an das Fenster anpasst.
Hier mal wie es nicht geht (natürlich mehr Inhalt reinpacken, sonst muss nicht gescrollt werden):

PHP-Code:

  <?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" styleName="plain" height="100%">
<mx:Panel width="100%" height="100%">
        <mx:Text>
            <mx:text><![CDATA[
Hallo Welt
Hallo Welt
Hallo Welt...]]>
            </mx:text>
        </mx:Text>
    </mx:Panel>
</mx:Application>

Irgendwelche Ideen?

blue · 03-09-2008, 14:40

Probier's mal damit:

Code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
	layout="horizontal" autoLayout="true" 
	horizontalAlign="center" 
	verticalAlign="middle">
	
	<mx:Panel minHeight="100" width="80%" height="80%">
	        <mx:Text>
	            <mx:text><![CDATA[
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt
					Hallo Welt...]]>
	            </mx:text>
        </mx:Text>
    </mx:Panel>
    
</mx:Application>

Janoscharlipp · 03-09-2008, 15:22

Hey, vielen Dank, das funktioniert!
Das essentielle Attribut ist in diesem Fall die minHeight beim Panel, was für mich überhaupt keinen Sinn macht

, aber es hilft trotzdem

Janoscharlipp · 03-09-2008, 15:49

Ok, zweiter Level.
Ich hab jetzt mal die Struktur meiner Anwendung (größtenteils) nachgebaut, und leider tut es wieder nicht, wie ich will.

Eigentlich sollen die Panels in vertikaler Richtung scrollen, in horizontaler Richtung sollen aber die Texte so umgebrochen werden, dass sie reinpassen.

Der Zwischenschritt mit dem Grid scheint fatal zu sein, die Texte scheinen die richtige Breite nicht zu bekommen.

PHP-Code:

  <?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

    styleName="plain"

>

    <mx:HBox width="100%" height="100%">

        <mx:Panel left="10" right="210" width="100%" height="100%">

            <mx:Label text="linke Seite" />

        </mx:Panel>

        <mx:Panel minHeight="100" right="10" width="200" height="100%">

            <mx:Grid width="100%">

                <mx:GridRow>

                    <mx:GridItem>

                        <mx:Label text="..." />

                    </mx:GridItem>

                    <mx:GridItem>

                        <mx:Text>

                            <mx:text><![CDATA[

rechte Seite oben | rechte Seite oben | rechte Seite oben | 

rechte Seite oben | rechte Seite oben | rechte Seite oben | 

rechte Seite oben | rechte Seite oben | rechte Seite oben |...

                ]]>                   

                            </mx:text>

                        </mx:Text>

                    </mx:GridItem>

                </mx:GridRow>

                <mx:GridRow>

                    <mx:GridItem>

                        <mx:Label text="..." />

                    </mx:GridItem>

                    <mx:GridItem>

                        <mx:Text>

                            <mx:text><![CDATA[

rechte Seite unten | rechte Seite unten | rechte Seite unten | 

rechte Seite unten | rechte Seite unten | rechte Seite unten | 

rechte Seite unten | rechte Seite unten | rechte Seite unten |...

                ]]>                     

                            </mx:text>

                        </mx:Text>

                    </mx:GridItem>

                </mx:GridRow>

            </mx:Grid>

        </mx:Panel>

    </mx:HBox>

</mx:Application>

**Omega Psi** · 03-09-2008, 15:56

Und wenn du zudem noch eine ScrollPolicy kicksed?

Janoscharlipp · 03-09-2008, 16:11

Dann sehe ich keine ScrollBar, der Text wird aber nicht umgebrochen, sondern einfach abgeschnitten.

**Omega Psi** · 03-09-2008, 16:19

Und dann noch wordwrap und was es da noch so gibt mal setzt?

Ich hoffe du empfindest meine Beiträge als konstruktiv

blue · 03-09-2008, 16:43

... oder so:

Code:

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    styleName="plain" 
> 
    <mx:HBox width="100%" height="100%"> 
        <mx:Panel left="10" right="210" width="100%" height="100%"> 
            <mx:Label text="linke Seite" /> 
        </mx:Panel> 
        <mx:Panel horizontalScrollPolicy="off" minHeight="100" right="10" width="200" height="100%"> 
        <mx:VBox width="100%">
           <mx:Grid width="100%"> 
                <mx:GridRow width="100%" height="100%" id="ro"> 
                    <mx:GridItem width="25%"> 
                        <mx:Label text="..." /> 
                    </mx:GridItem> 
                    <mx:GridItem width="100%"> 
                        <mx:Text width="75%" height="100%"> 
                            <mx:text><![CDATA[ 
								rechte Seite oben | rechte Seite oben | rechte Seite oben |  
								rechte Seite oben | rechte Seite oben | rechte Seite oben |  
								rechte Seite oben | rechte Seite oben | rechte Seite oben |  
								rechte Seite oben | rechte Seite oben | rechte Seite oben |  
								rechte Seite oben | rechte Seite oben | rechte Seite oben |  
								rechte Seite oben | rechte Seite oben | rechte Seite oben |  
								rechte Seite oben | rechte Seite oben | rechte Seite oben |... 
								]]>                    
                            </mx:text> 
                        </mx:Text>
                    </mx:GridItem> 
                </mx:GridRow> 
                <mx:GridRow width="100%" height="100%" id="ru">
                    <mx:GridItem width="25%"> 
                        <mx:Label text="..." /> 
                    </mx:GridItem> 
                    <mx:GridItem width="100%"> 
                        <mx:Text width="75%" height="100%"> 
                            <mx:text><![CDATA[ 
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |  
								rechte Seite unten | rechte Seite unten | rechte Seite unten |...]]>                      
                            </mx:text> 
                        </mx:Text> 
                    </mx:GridItem> 
                </mx:GridRow> 
            </mx:Grid> 
        	
        </mx:VBox>
         </mx:Panel> 
    </mx:HBox> 
</mx:Application>

Janoscharlipp · 03-09-2008, 18:42

@Omega Psi
ähhh, nein

Vielen Dank blue, funktioniert wieder, ist aber nicht ganz, wie ich es mir vorgestellt habe.
Was mich stört ist, die (zwingende) Angabe einer Breite bei einem GridItem. Der Witz vom Grid ist ja gerade, dass es die Breite ermittelt. Wenn ich diese Breite aber auf 100% setzte (was überhaupt keinen Sinn macht) funktioniert es so wie ich möchte, die Spalten passen sich an den (linken) Inhalt an, und der Text wird umgebrochen.
Hier meine Lösung (habe alles gelöscht, was nicht notwendig war)

PHP-Code:

  <?xml version="1.0" encoding="utf-8"?> 

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 

    styleName="plain" 

> 

    <mx:HBox width="100%" height="100%"> 

        <mx:Panel left="10" right="210" width="100%" height="100%"> 

            <mx:Label text="linke Seite" /> 

        </mx:Panel> 

        <mx:Panel minHeight="100" right="10" width="200" height="100%"> 

        <mx:VBox width="100%">

           <mx:Grid width="100%"> 

                <mx:GridRow width="100%">

                    <mx:GridItem> 

                        <mx:Label text="123456789" /> 

                    </mx:GridItem> 

                    <mx:GridItem width="100%">

                        <mx:Text width="100%"> 

                            <mx:text><![CDATA[ 

1 rechte Seite oben | 2 rechte Seite oben | 3 rechte Seite oben |  

1 rechte Seite oben | 2 rechte Seite oben | 3 rechte Seite oben |  

1 rechte Seite oben | 2 rechte Seite oben | 3 rechte Seite oben |  ...

]]>                    

                            </mx:text> 

                        </mx:Text>

                    </mx:GridItem> 

                </mx:GridRow> 

                <mx:GridRow width="100%">

                    <mx:GridItem>

                        <mx:Label text="123" /> 

                    </mx:GridItem> 

                    <mx:GridItem>

                        <mx:Text width="100%"> 

                            <mx:text><![CDATA[ 

1 rechte Seite unten | 2 rechte Seite unten | 3 rechte Seite unten |  

1 rechte Seite unten | 2 rechte Seite unten | 3 rechte Seite unten |  

1 rechte Seite unten | 2 rechte Seite unten | 3 rechte Seite unten | ... ]]>                      

                            </mx:text> 

                        </mx:Text> 

                    </mx:GridItem> 

                </mx:GridRow> 

            </mx:Grid> 

            

        </mx:VBox>

         </mx:Panel> 

    </mx:HBox> 

</mx:Application>

blue · 04-09-2008, 08:54

Eine prozentuale Breitenverteilung reguliert krasse Spaltenformatierungen (hässlich) etwas runter.

Die Möglichkeiten der constraint layouts sind halt a weng komplex

.
Da muss man erst mal durchsteigen, welche Abhängigkeiten bestehen und wie diese gewichtet sind (siehe minWidth).

Janoscharlipp · 04-09-2008, 11:25

Zitat:

Zitat von blue

Da muss man erst mal durchsteigen, welche Abhängigkeiten bestehen und wie diese gewichtet sind (siehe minWidth).

Ich übersetze: Da muss man erstmal durchsteigen, welche Bugs bestehen, und wie man diese umgeht (siehe minWidth).

03-09-2008, 12:37	#1 (permalink)
Janoscharlipp muh Registriert seit: Apr 2002 Ort: Freiburg / Stuttgart Beiträge: 4.338	Prozentuale Höhe für Panel und trotzdem Scrollen Moin, ich versuche verzweifelt, ein Panel mit prozentualer Höhe dazu zu bringen, eine ScrollBar einzublenden, falls sein Inhalt zu groß ist. Statt dessen passt sich bei mir immer das Panel an seinen Inhalt an, und erst die Application bietet dann die Scrollbar. Prozentuale Höhe muss sein, damit es sich in der Höhe an das Fenster anpasst. Hier mal wie es nicht geht (natürlich mehr Inhalt reinpacken, sonst muss nicht gescrollt werden): PHP-Code: `<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" styleName="plain" height="100%"> <mx:Panel width="100%" height="100%"> <mx:Text> <mx:text><![CDATA[ Hallo Welt Hallo Welt Hallo Welt...]]> </mx:text> </mx:Text> </mx:Panel> </mx:Application>` Irgendwelche Ideen? __________________ »Carpe diem«, sagte der Graf. (Terry Pratchett: Ruhig Blut!)

03-09-2008, 15:22	#3 (permalink)
Janoscharlipp muh Registriert seit: Apr 2002 Ort: Freiburg / Stuttgart Beiträge: 4.338	Hey, vielen Dank, das funktioniert! Das essentielle Attribut ist in diesem Fall die minHeight beim Panel, was für mich überhaupt keinen Sinn macht , aber es hilft trotzdem __________________ »Carpe diem«, sagte der Graf. (Terry Pratchett: Ruhig Blut!)

03-09-2008, 15:49	#4 (permalink)
Janoscharlipp muh Registriert seit: Apr 2002 Ort: Freiburg / Stuttgart Beiträge: 4.338	Ok, zweiter Level. Ich hab jetzt mal die Struktur meiner Anwendung (größtenteils) nachgebaut, und leider tut es wieder nicht, wie ich will. Eigentlich sollen die Panels in vertikaler Richtung scrollen, in horizontaler Richtung sollen aber die Texte so umgebrochen werden, dass sie reinpassen. Der Zwischenschritt mit dem Grid scheint fatal zu sein, die Texte scheinen die richtige Breite nicht zu bekommen. PHP-Code: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" styleName="plain" > <mx:HBox width="100%" height="100%"> <mx:Panel left="10" right="210" width="100%" height="100%"> <mx:Label text="linke Seite" /> </mx:Panel> <mx:Panel minHeight="100" right="10" width="200" height="100%"> <mx:Grid width="100%"> <mx:GridRow> <mx:GridItem> <mx:Label text="..." /> </mx:GridItem> <mx:GridItem> <mx:Text> <mx:text><![CDATA[ rechte Seite oben \| rechte Seite oben \| rechte Seite oben \| rechte Seite oben \| rechte Seite oben \| rechte Seite oben \| rechte Seite oben \| rechte Seite oben \| rechte Seite oben \|... ]]> </mx:text> </mx:Text> </mx:GridItem> </mx:GridRow> <mx:GridRow> <mx:GridItem> <mx:Label text="..." /> </mx:GridItem> <mx:GridItem> <mx:Text> <mx:text><![CDATA[ rechte Seite unten \| rechte Seite unten \| rechte Seite unten \| rechte Seite unten \| rechte Seite unten \| rechte Seite unten \| rechte Seite unten \| rechte Seite unten \| rechte Seite unten \|... ]]> </mx:text> </mx:Text> </mx:GridItem> </mx:GridRow> </mx:Grid> </mx:Panel> </mx:HBox> </mx:Application> __________________ »Carpe diem«, sagte der Graf. (Terry Pratchett: Ruhig Blut!)

03-09-2008, 15:56	#5 (permalink)
Omega Psi Perverted Hermit Registriert seit: Mar 2004 Ort: Delmenhorst Beiträge: 12.147	Und wenn du zudem noch eine ScrollPolicy kicksed? __________________ http://icodeapps.net \| Meet me at the Flex user group Hamburg talking about CoffeeScript

03-09-2008, 16:11	#6 (permalink)
Janoscharlipp muh Registriert seit: Apr 2002 Ort: Freiburg / Stuttgart Beiträge: 4.338	Dann sehe ich keine ScrollBar, der Text wird aber nicht umgebrochen, sondern einfach abgeschnitten. __________________ »Carpe diem«, sagte der Graf. (Terry Pratchett: Ruhig Blut!)

03-09-2008, 16:19	#7 (permalink)
Omega Psi Perverted Hermit Registriert seit: Mar 2004 Ort: Delmenhorst Beiträge: 12.147	Und dann noch wordwrap und was es da noch so gibt mal setzt? Ich hoffe du empfindest meine Beiträge als konstruktiv __________________ http://icodeapps.net \| Meet me at the Flex user group Hamburg talking about CoffeeScript

03-09-2008, 18:42	#9 (permalink)
Janoscharlipp muh Registriert seit: Apr 2002 Ort: Freiburg / Stuttgart Beiträge: 4.338	@Omega Psi ähhh, nein Vielen Dank blue, funktioniert wieder, ist aber nicht ganz, wie ich es mir vorgestellt habe. Was mich stört ist, die (zwingende) Angabe einer Breite bei einem GridItem. Der Witz vom Grid ist ja gerade, dass es die Breite ermittelt. Wenn ich diese Breite aber auf 100% setzte (was überhaupt keinen Sinn macht) funktioniert es so wie ich möchte, die Spalten passen sich an den (linken) Inhalt an, und der Text wird umgebrochen. Hier meine Lösung (habe alles gelöscht, was nicht notwendig war) PHP-Code: <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" styleName="plain" > <mx:HBox width="100%" height="100%"> <mx:Panel left="10" right="210" width="100%" height="100%"> <mx:Label text="linke Seite" /> </mx:Panel> <mx:Panel minHeight="100" right="10" width="200" height="100%"> <mx:VBox width="100%"> <mx:Grid width="100%"> <mx:GridRow width="100%"> <mx:GridItem> <mx:Label text="123456789" /> </mx:GridItem> <mx:GridItem width="100%"> <mx:Text width="100%"> <mx:text><![CDATA[ 1 rechte Seite oben \| 2 rechte Seite oben \| 3 rechte Seite oben \| 1 rechte Seite oben \| 2 rechte Seite oben \| 3 rechte Seite oben \| 1 rechte Seite oben \| 2 rechte Seite oben \| 3 rechte Seite oben \| ... ]]> </mx:text> </mx:Text> </mx:GridItem> </mx:GridRow> <mx:GridRow width="100%"> <mx:GridItem> <mx:Label text="123" /> </mx:GridItem> <mx:GridItem> <mx:Text width="100%"> <mx:text><![CDATA[ 1 rechte Seite unten \| 2 rechte Seite unten \| 3 rechte Seite unten \| 1 rechte Seite unten \| 2 rechte Seite unten \| 3 rechte Seite unten \| 1 rechte Seite unten \| 2 rechte Seite unten \| 3 rechte Seite unten \| ... ]]> </mx:text> </mx:Text> </mx:GridItem> </mx:GridRow> </mx:Grid> </mx:VBox> </mx:Panel> </mx:HBox> </mx:Application> __________________ »Carpe diem«, sagte der Graf. (Terry Pratchett: Ruhig Blut!)

04-09-2008, 08:54	#10 (permalink)
blue random Registriert seit: Jun 2001 Beiträge: 834	Eine prozentuale Breitenverteilung reguliert krasse Spaltenformatierungen (hässlich) etwas runter. Die Möglichkeiten der constraint layouts sind halt a weng komplex . Da muss man erst mal durchsteigen, welche Abhängigkeiten bestehen und wie diese gewichtet sind (siehe minWidth). __________________ ------------------- ciao, blue

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln