3 Replies Latest reply on May 3, 2007 7:17 AM by Newsgroup_User

    Synchronizing data between viewStack elements

    Level 7
      When a user clicks on a container built with repeated array collection
      elements in one viewStack layer, the selected element needs to be
      utilized to populate the data in a second viewStack layer and
      vice-a-versa.

      Conceptually how does one do this? Do I set some type of global
      variable|pointer or pass the objects from one view to the other somehow
      or can one view layer be aware of another's data?

      I suspect this is not a detailed enough description, please feel free to
      ask questions to help me describe the specifics.
        • 1. Re: Synchronizing data between viewStack elements
          michael_ramirez44 Level 1
          Could you provide a small example of what you are trying to do?
          • 2. Re: Synchronizing data between viewStack elements
            Level 7
            michael_ramirez44 wrote:
            > Could you provide a small example of what you are trying to do?

            Yes, I will do that tomorrow, I have 5 minutes to catch my train home.

            • 3. Re: Synchronizing data between viewStack elements
              Level 7
              michael_ramirez44 wrote:
              > Could you provide a small example of what you are trying to do?

              As promised, a concept of what I am trying to do. As you can see in my
              root application, MobileCalendar.mxml, I am getting data from a
              RemoteObject call. This is returning an array collection consisting of
              28, 35 or 42 elements. Each element is an object containing several
              properties, including one which is also an array collection. Then I
              define a two element view stack.

              In the first view stack element is the Calendar.mxml container which
              uses the array collection in a repeater control to create a DayBox
              container for each element. Inside the DayBox.mxml container is
              repeater control that uses the array collection property of the element
              used to create each DayBox.

              Then there is the second element of the view stack that will be a
              'detail' view based on which element was selected in the above DayBox.
              In this Details.mxml there is a two element HDividedBox. The first
              element will display the details of the element used to create the
              daybox that contains the element the user selected, and the second
              element will display the details of the sub element the user selected.

              I have this currently working by using global variables to store
              references|copies? of the selected element. What I'm hoping to discuss
              is the merits of this concept and possible other techniques.

              Thanks to anybody you read all this. Not as short as I hoped.

              MobileCalendar.mxml
              -------------------
              <?xml version="1.0" encoding="utf-8"?>
              <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
              layout="absolute"
              minWidth="940" creationComplete="getCalendar()"
              xmlns:mcViews="Flex.Views.*">

              ...

              <mx:RemoteObject
              id="mobCalCFC"
              destination="ColdFusion"
              source="CFC.MobileCalendar"
              showBusyCursor="true"
              fault="mobCalCFC_faults(event)">
              <mx:method name="test" result="test_handler(event)"/>
              <mx:method name="getDays" result="getDays_handler(event)"/>
              </mx:RemoteObject>

              <mx:ViewStack id="mobileCalendarViewStack" left="10" top="10"
              bottom="10" right="10">
              <mcViews:Calendar
              id="calendarDisplay" label="Mobile Calendar"
              width="100%" minWidth="0"
              height="100%" minHeight="0" />

              <mcViews:Details
              id="eventDetails" label="Details"
              width="100%" minWidth="0"
              height="100%" minHeight="0" />
              </mx:ViewStack>
              </mx:Application>



              Calendar.mxml
              -------------
              <?xml version="1.0" encoding="utf-8"?>
              <mx:Panel
              xmlns:mx=" http://www.adobe.com/2006/mxml"
              layout="vertical"
              title="Mobile Calendar"
              left="10" top="10" bottom="10" right="10"
              xmlns:mcViews="Flex.Views.*">

              ...

              <mx:VBox width="100%" height="{parentDocument.height - 195}"
              paddingLeft="5">
              <mx:Repeater
              id="weekRows"
              dataProvider="{weekStartsAry}">
              <mx:HBox width="100%" horizontalGap="5">
              <mx:Repeater id="dayCells" dataProvider="{parentApplication.daysAry}"
              startingIndex="{weekRows.currentItem}" count="7">
              <mcViews:DayBox
              dayData="{dayCells.currentItem}"
              width="14.25%" minWidth="0"
              height="100%" minHeight="0"/>
              </mx:Repeater>
              </mx:HBox>
              </mx:Repeater>
              </mx:VBox>
              </mx:Panel>



              DayBox.mxml
              -----------
              <mx:VBox
              xmlns:mx=" http://www.adobe.com/2006/mxml"
              borderStyle="solid"
              horizontalScrollPolicy="off"
              backgroundColor="white">

              ...

              <mx:HBox horizontalAlign="right" backgroundColor="{(dayData.inMonth) ?
              0x002649 : 0x8093A4}" width="100%">

              ...

              <mx:Repeater id="draws" dataProvider="{dayData.drawsQry}">
              <mx:VBox
              id="drawDetails"
              verticalGap="0"
              paddingLeft="5" paddingRight="5"
              click="viewDetails(dayData,event.currentTarget.getRepeaterItem())"
              styleName="{draws.currentItem.N_LOC_AREA}">

              <mx:Label
              text="{draws.currentItem.R_MOB_MNAME}"

              toolTip="{draws.currentItem.R_MDL_MOBLID}&#13;{draws.currentItem.R_MOB_MNAME}&#13;AM:
              {draws.currentItem.R_RCT_NAME}"
              width="100%" minWidth="0"
              truncateToFit="true"/>

              ...
              </mx:VBox>
              </mx:Repeater>
              </mx:VBox>


              Details.mxml
              ------------
              <mx:HDividedBox
              xmlns:mx=" http://www.adobe.com/2006/mxml"
              x="0" y="0"
              xmlns:mcView="Flex.Views.*">

              ...

              <mcView:Detail_Day
              id="showme"
              x="0" y="185"
              width="20%" minWidth="0"
              height="100%" minHeight="0"/>

              <mx:Panel
              title="{parentApplication.displayDraw.R_MOB_MNAME}"
              width="80%" minWidth="0"
              height="100%" minHeight="0"
              layout="absolute">

              ...
              </mx:Panel>
              </mx:HDividedBox>