Select to view content in your preferred language

How to adjust the attributeInspector skin of EditWidget in flex viewer?

637
1
04-26-2011 06:15 AM
MikeCliffton
Emerging Contributor
I tried to adjust the attributeInspector skin of EditWidget of flex viewer.
In the file EditWidgetAttributeInspectorSkin, I want to make form item (content) height to 20.  Currently, it is the same size as the data from feature service.  I add <mx:FormItem height="20" /> to the mx:Form, but the item height is still very big, nothing changed.

<mx:Form id="form"  
             enabled.disabled="false"
             horizontalScrollPolicy="off"
    width="400" height="600"
    maxHeight="{hostComponent.getStyle('formMaxHeight')}"
    verticalScrollPolicy="off">
  <mx:FormItem height="20" /> 
      </mx:Form>


I also tried to create a method as the following, but the attribute table height change to 100, the form content is still there. See the attachment. I guess I have to change the feature layer from the file EditWidget, but don't know how. Thank you!

private function changeForm():void
   {
    hostComponent.singleToMultilineThreshold=20;
    hostComponent.height = 100;
   }
Tags (2)
0 Kudos
1 Reply
MikeCliffton
Emerging Contributor
I add some codes in the EditWidgetAttributeInpectorSkin.mxml, it kind of works, but I still got two issues:
1. how to get rid of <mx:Form> from skin. Now, if I delete it, flex viewer always reported that form was missing. Do I need to go to ArcGIS_Flex source code to change that AttributeInspectorSkin? What is the differece between this one with  EditWidgetAttributeInpectorSkin.mxml? They all applied to [HostComponent("com.esri.ags.components.AttributeInspector")], right?
2. How do I tell to use featureLayer="{hostComponent.featureLayers[0]} or                   featureLayer="{hostComponent.featureLayers[1]}? It seems if I use the first one, I can not control the height of form item, why? Thanks!

<s:BorderContainer  backgroundColor="0xFFFFFF">
  
  <esri:AttributeInspector width="400" height="300"
        featureLayers="{hostComponent.featureLayers}"
        formItemsOrder="fieldInspector" 
        deleteButtonVisible= "false">
   
   <esri:FieldInspector  featureLayer="{hostComponent.featureLayers[0]}" 
          fieldName="Ana_Type" label="Ecology" >
    <esri:renderer >
     <fx:Component>
      <esri:TextField width="250" height="55"/>
     </fx:Component>
    </esri:renderer> 
   </esri:FieldInspector>
   
  <esri:FieldInspector  featureLayer="{hostComponent.featureLayers[0]}" 
         fieldName="Kurch_w" label="NLme" >
   <esri:renderer >
    <fx:Component>
     <esri:TextField width="250" height="55"/>
    </fx:Component>
   </esri:renderer> 
  </esri:FieldInspector>
   
  <esri:FieldInspector  featureLayer="{hostComponent.featureLayers[0]}" 
          fieldName="Email" label="Email" >
    <esri:renderer >
     <fx:Component>
      <esri:TextField width="250" height="55"/>
     </fx:Component>
    </esri:renderer> 
   </esri:FieldInspector>
   
   <esri:FieldInspector  featureLayer="{hostComponent.featureLayers[1]}" 
          fieldName="Author" label="Author" >
    <esri:renderer >
     <fx:Component>
      <esri:TextField width="250" height="55"/>
     </fx:Component>
    </esri:renderer> 
   </esri:FieldInspector>
   
   
 </esri:AttributeInspector>
  
 </s:BorderContainer>
0 Kudos