#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2016
    Posts
    5
    Rep Power
    0

    buttons in xsl xml


    hello,im developing an posxml apps for androids.
    For viewing,we have android native screen for inputs purposes and webview just for displaying items tagged as variable.

    For webview ,we have xml and xsl page,and im intending to add in some buttons(navigation purposes).For example below are sample code.

    1.mainmenu.xml
    Code:
    <?xml version="1.0" encoding="UTF-8" ?>
    <PosXML version="7.1.0">
    <display column="0" line="2" message="VEDC - Online" />
    <display column="0" line="3" message="Main Menu" />
    <display column="0" line="4" message="1. Sales" />
    <display column="0" line="6" message="2. Void" />
    <display column="0" line="8" message="3. Receipt" />
    <display column="0" line="10" message="4. Report" />
    <!-- <display column="0" line="12" message="5. Settlement" /> -->
    <display column="0" line="14" message="5. Setting" />
    <display column="0" line="16" message="6. Exit" />
    <display column="0" line="18" message="Select : " />
    <waitkey />
    </PosXML>
    2.mainmenu.xsl
    Code:
    <?xml version="1.0"?>
    <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    version="1.0">
    <xsl:template match="/">
    
    <html>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <link href="file:///android_asset/css/jquery.mobile-1.4.5.min.css" rel="stylesheet" type="text/css"></link>
    <script src="file:///android_asset/js/jquery-1.5.min.js" type="text/javascript"></script>
    <script src="file:///android_asset/js/jquery.mobile-1.4.5.min.js" type="text/javascript"></script>
    <style>
    	#page{
    	height:100%;
    	background: #a9e0bd;
    	position:absolute;
    	top:0;
    	left:0;
    	right:0;
    	bottom:0;
    	}
    	
    	#page .ui-header {
    	height: 60px;
    	background: #a9e0bd;
    	
    	}
    	
    	#page .ui-content {
    	background:  #a9e0bd;
    	
    	}
    	
    	#page .ui-footer {
    	height: 60px;
    	background: #a9e0bd;
    	
    	
    	}
    	
    	.fit-content, .bottom-footer {
    	position : absolute;
    	}
    	
    	.fit-content {
    	top : 60px;
    	bottom : 60px;
    	left : 0;
    	right : 0;
    	background:  #a9e0bd;
    	
    	}
    	.fit-content > div {
    	height : 100%;
    	}
    	
    	.bottom-footer {
    	bottom : 0;
    	width : 100%;
    	} 
    </style>
    <title>Payment</title>
    </head>
    
    <body>
    
    <div data-role="page" id="page">
      <div data-role="header" data-position="fixed">
      <table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="60"><img src="file:///android_asset/images/topbar.png" width="50" height="50" /></td>
        <td><font color="#000000">
    	<xsl:for-each select="PosXML/display">
    		<xsl:variable name="column" select="@column"></xsl:variable>
    		<xsl:variable name="line" select="@line"></xsl:variable>
    		<xsl:variable name="message" select="@message"></xsl:variable>
    		<xsl:choose>
    		<xsl:when test="$line = '2'">
    			<p><xsl:value-of select="$message"/></p>
    		</xsl:when>
    		</xsl:choose>
    	</xsl:for-each>
        </font></td>
      </tr>
    </table>  	
      </div>
      <div data-role="content" class="fit-content">
    	<xsl:for-each select="PosXML/display">
    		<xsl:variable name="column" select="@column"></xsl:variable>
    		<xsl:variable name="line" select="@line"></xsl:variable>
    		<xsl:variable name="message" select="@message"></xsl:variable>
    		<xsl:choose>
    		
    		<xsl:when test="$line = '3'">
    			<p style="font-weight:bold;"><xsl:value-of select="$message"/></p>
    			<p style="height:30px;"></p>
    		</xsl:when>
    		
    		<xsl:when test="$line &gt; 3 and $line &lt; 18">
    			<span><xsl:value-of select="$message"/></span><br></br>
    		</xsl:when>
    		
    		<xsl:when test="$line = '18'">
    			<label for="inputRemark"><b><xsl:value-of select="$message"/></b></label>	
    		    <input type="text" name="inputAmount" id="inputAmount" value=""></input>
    		</xsl:when>
    		
    		</xsl:choose>
    	
    	</xsl:for-each>
      </div>
      <div data-role="footer" align="right" data-position="fixed" class="bottom-footer">
    	<span style="vertical-align:middle"><font color="#000000" size="3">Copyright 2015</font></span>    
      </div>
    </div>
    
    </body>
    </html>
    </xsl:template>
    </xsl:stylesheet>
    Really appreciate you guys help,thanks in advance .
  2. #2
  3. Lazy Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    16,435
    Rep Power
    9645
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2016
    Posts
    5
    Rep Power
    0
    My bad,i actually wants to put up some buttons just above the footer,and below are what i can came up so far,


    Code:
    #buttonarea {
    height:100%;
    width:0;
    position:absolute;
    
    }//this will include in the <style>
    
    <div data-role="buttonarea" id="button">
    <table width="100%" border="0" cellspacing="20" cellpadding="10">
    <tr>
    <td>
    <img src="images.png" width="" height="">//images of button c
    <img src="images.png" width="" height="">//images of button no
    <img src="images.png" width="" height="">//images of button next
    
    
    </div>
    rather simple,but i have not touch xml/xsl before,please advise.

    Tqia.
  6. #4
  7. Lazy Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    16,435
    Rep Power
    9645
    Well you don't have to really do anything with the XSL - just stick the stuff you have into the right place. So the CSS goes in that one big <style>, then the new <div> above (or maybe inside at the top of) the footer div. Then you test and see what's wrong.
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2016
    Posts
    5
    Rep Power
    0
    below are part from welcome.xsl

    <div data-role="buttonarea" id="button">
    <table width="100%" border="0" cellspacing="20" cellpadding="10">
    <tr>
    <td>
    <img src="file:///android_asset/images/right.png" width="50" height="50" align="right"></img>//images of button no
    </td>
    </tr>
    </table>
    </div>

    What i have here is an image,which set as a button.Android-wise,how do i set touch listener to the image so that it will call next activity?
    please advise,thank you in advance.
  10. #6
  11. Lazy Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    16,435
    Rep Power
    9645
    That's not really an XML question. Try making a thread in the Android forum for it.
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2016
    Posts
    5
    Rep Power
    0
    thanks for your concern,have a good day
  14. #8
  15. Not An Expert
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2015
    Posts
    404
    Rep Power
    3
    Thread continued here: setting a button

    Closing this one!

IMN logo majestic logo threadwatch logo seochat tools logo