Pick up modified skins; add resize code to TagViewer
authorRichard Fairhurst <richard@systemeD.net>
Sun, 4 Mar 2012 18:35:43 +0000 (18:35 +0000)
committerRichard Fairhurst <richard@systemeD.net>
Sun, 4 Mar 2012 18:35:43 +0000 (18:35 +0000)
net/systemeD/potlatch2/TagViewer.mxml
styles/Application.css

index 693bc65..3a1cc38 100644 (file)
                                        subpanel.styleName="subcategoryPanel";
                                        subpanel.title=subcategory;
                                        subpanels[category][subcategory]=subpanel;
-                                       var form:Form = new Form();
-                                       form.name = "form";
-                                       form.layout = getFormLayout();
-                                       subpanel.addChild(form);
+                                       addConstrainedForm(subpanel);
                                        tabComponents[tab].push(subpanel);
                                }
                                Form(subpanel.getChildByName("form")).addElement(UIComponent(catEditor));
                return 0;
        }
        
-      private function createEditorBox():VBox {
-          var box:VBox = new VBox();
-          box.percentWidth = 100;
-          box.percentHeight = 100;
-          box.styleName = "dndEditorContainer";
-          var form:Form = new Form();
-          form.name = "form";
-          form.layout = getFormLayout();
-          box.addChild(form);
-          return box;
-      }
+       private function createEditorBox():VBox {
+               var box:VBox = new VBox();
+               box.percentWidth = 100;
+               box.percentHeight = 100;
+               box.styleName = "dndEditorContainer";
+               addConstrainedForm(box);
+               return box;
+       }
+       
+       private function addConstrainedForm(parentObject:DisplayObjectContainer):void {
+               var form:Form = new Form();
+               form.name = "form";
+               form.percentWidth=100;
+               form.addEventListener(mx.events.ResizeEvent.RESIZE, formResizeHandler, false, 0, true);
+               parentObject.addChild(form);
+               if (parentObject.width>0) form.maxWidth=parentObject.width;
+       }
+       
+       private function formResizeHandler(e:Event):void {
+               var form:Form=Form(e.target);
+               if (form.parent.width>0) form.maxWidth=form.parent.width;
+       }
 
       private function ensureEditorsPopulated(tab:VBox):void {
           var components:Array = tabComponents[tab];
                event.target.height=rows*(event.target.rowHeight+1);
        }
 
-    private function getFormLayout():FormLayout {
-        var layout:FormLayout = new FormLayout();
-          // This is ugly, and should really be done with a skin. See
-          // http://stackoverflow.com/questions/5126756/flex-spark-form-item-gap
-        layout.gap = -8;
-        return layout;
-    }
   ]]></fx:Script>
 </mx:VBox>
 
index 87bc976..e861063 100644 (file)
@@ -185,6 +185,15 @@ mx|ApplicationControlBar {
        fontWeight: bold;
 }
 
+/* Simple tag view - form */
+
+s|Form {
+       skinClass: ClassReference("net.systemeD.potlatch2.skins.CustomFormSkin");
+}
+s|FormItem {
+       skinClass: ClassReference("net.systemeD.potlatch2.skins.CustomFormItemSkin");
+}
+
 /* Simple tag view - header */
 
 .dndTagHeader {