This tutorial demonstrates how to add custom transition buttons at
    the bottom of a long custom state form, so users do not have to scroll to the
    top of the form to click a standard transition button in the button bar. It
    also demonstrates how to use a single custom transition button for multiple
    transitions. 
  
 
    Prerequisites:
 
      Before you start this tutorial, create a new process app from the 
        
Application Process App template in the 
        
Create New Process App Dialog Box,
        and add the following states and transitions to the application workflow: 
      
 
        - Assigned ("active" state) 
        
 
 
        - Work Started ("active" state) 
        
 
 
        - In Peer Review ("active" state) 
        
 
 
        - In QA ("active" state) 
        
 
 
        - Closed ("completed" state) 
        
 
 
        - Assign ("regular" transition) 
        
 
 
        - Start Work ("regular" transition) 
        
 
 
        - Review ("regular" transition) 
        
 
 
        - Test ("regular" transition) 
        
 
 
        - Close ("regular" transition) 
        
 
 
      
 
 
     
 
     
      To repeat standard transition buttons:
 
     
 
    -  
        Create a custom state form. In the 
          Form Configuration dialog box, select 
          Based on 'quick form' for: 
            application Table. (For
          instructions, see 
          Creating Custom Forms.) 
         
      
 
-  
        On the 
          Forms tab of the workflow Property Editor,
          select the form you just created from the 
          Default state form list, then click 
          Edit. 
         
         The state form opens in the form editor. 
        
      
 
-  
        On the 
          Toolbar tab of the form Property Editor, clear
          the 
          Remove transition buttons matching custom transition
            controls check box. 
         
         This step is necessary so buttons can be at both the top
          (button bar) and bottom of the form. 
         
      
 
-  
        Drag a 
          Panel control from the 
          Container Controls section of the 
          Form Palette to the bottom of the form, and
          drop it on the green row that appears. 
         
         The 
          Insert Dialog Box
          opens. 
         
      
 
-  
        In the 
          Insert Panel dialog box, select 
          3 columns, 
          1 row, and 
          All autoSize. Click 
          OK.
         
      
 
-  
        Drag a 
          Button control from the 
          Other Controls section of the 
          Form Palette to each column in the new row. 
         
      
 
-  
        Select the button in the first column. (This button will be used
          for all outgoing transitions you added to the application workflow.) Click the 
          Behavior tab of the form Property Editor, and
          perform the following steps: 
         
        
 
          -  
            Select 
              Perform a transition. 
             
          
 
 
          -  
            Select 
              Show transition name. 
             
             This option lets you add a single transition button for
              all transitions you added to the workflow. The button label changes
              automatically based on the current state. It also changes automatically if the
              transition name is changed in the application workflow. 
             
          
 
 
        
 
       
-  
        Still on the 
          Behavior tab, click 
          Add. In the 
          Add Transition Dialog Box, perform
          the following steps: 
         
        
 
          -  
            Select the application workflow and the 
              New state. Because there is only one
              outgoing transition from this state, the 
              Assign transition is already selected.
              Click 
              OK. 
             
          
 
 
          -  
            Click 
              Add again. Select the 
              Assigned state. (The 
              Start Work transition is selected.) Click 
              OK. 
             
          
 
 
          -  
            Click 
              Add again. Select the 
              Work Started state. (The 
              Review transition is selected). Click 
              OK. 
             
          
 
 
          -  
            Click 
              Add again. Select the 
              In Peer Review state. (The 
              Test transition is selected.) Click 
              OK. 
             
          
 
 
          -  
            Click 
              Add again. Select the 
              In QA state. (The 
              Close transition is selected.) Click 
              OK. 
             
          
 
 
        
 
          
          Note: If you do not select 
            Show transition name, you must type the
            button label in the 
            Display text box on the 
            General tab of the button Property Editor. 
          
 
         
       
-  
        Select the button in the second column. (This button will be used
          to repeat the 
          Update button, which is for a built-in
          transition and on the standard button bar). Perform the following steps: 
         
        
 
          -  
            Click the 
              General tab of the button Property Editor.
              
             
          
 
 
          -  
            Type 
              Update in the 
              Display text box. 
             
          
 
 
          -  
            Click the 
              Behavior tab of the button Property
              Editor. 
             
          
 
 
          -  
            Select 
              Perform a transition. 
             
          
 
 
          -  
            Clear 
              Show transition name. 
             
             This ensures that the label you typed on the 
              General tab will be displayed on the
              button instead of the transition name. 
             
          
 
 
          -  
            Click 
              Add. In the 
              Add Transition dialog box, select the 
              [Any] state and the 
              Update transition. Click 
              OK. 
             
          
 
 
        
 
       
-  
        Repeat the previous step for the button in the third column, but
          type 
          Delete in the 
          Display text box, and in the 
          Add Transition dialog box, select the 
          Delete transition.
          (Delete is also a built-in transition.) 
         
      
 
-  
        To see the changes you made, click 
          Preview in the Ribbon. 
         
      
 
 
    On the custom state form, the transition buttons appear at both the
      top and bottom of the form. (The standard transition button bar is at the top
      of the form, and the custom transtition buttons are at the bottom of the form.)
      
    
 
   
 
Copyright © 2007–2016 Serena Software, Inc. All rights reserved.