1) Display Graphical Chart from XML data
Imagine you receive the XML data from Web Service, as shown below:
<?xml version="1.0" encoding="utf-8"?>
<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema">
<soap:Body>
<FahrenheitToCelsiusResponse xmlns="http://tempuri.org/">
<FahrenheitToCelsiusResult>-11.6666666666667</FahrenheitToCelsiusResult>
</FahrenheitToCelsiusResponse>
</soap:Body>
</soap:Envelope>
Now you will call the web service, receive the XML data, parse the XML data, and display a graphical chart based on the data received through the web service.
- Calling the web service:
private String SOAP_ACTION = "http://192.168.10.1/methods/soap-api";
...
HttpTransportSE androidHttpTransport = new HttpTransportSE(URL1);
androidHttpTransport.debug = true;
androidHttpTransport.call(SOAP_ACTION, envelope);
- Receiving the data:
String Data = androidHttpTransport.responseDump;
- Parsing the data:
the start element and end element are FahrenheitToCelsiusResponse.
the tag comparison is using FahrenheitToCelsiusResult.
use the javax xml parsers and org xml sax helpers.
import javax.xml.parsers.SAXParser;
import org.xml.sax.helpers.DefaultHandler;
List<TemperatureData> Data_List;
String DataStr="";
InputStream is = new ByteArrayInputStream(Data.getBytes("UTF-8"));
Data_List = SAXParseXML.readXML(is);
- Copy the parsed data to a string:
for(int i =0;i<Data_List.size();i++) {
//use integer i as the index
Index = Integer.toString(i);
//Get Fahrenheit from the edit text field
//Fahrenheit = Data_List.get(i).Fahrenheit;
Fahrenheit = txtFar.getText().toString();
Celsius = Data_List.get(i).Celsius;
DataStr+= "["+Index+","+Fahrenheit+","+Celsius+"]";
if (i!=Data_List.size()-1)
DataStr+= ",\n";
else
break;
}
- Format the string into html format, plot the chart using Google Charts:
final String chartHtml = getChartHtml(DataStr);
public static String getChartHtml(String Data)
{
String chartHtml = null;
try{
// Generating html content.
chartHtml = URLDecoder.decode(
"<html><head>" +
"<script type=\"text/javascript\" src=\"https://www.google.com/jsapi\"></script>\n" +
"<script type=\"text/javascript\">\n" +
"google.load(\"visualization\",\"1\", {packages:[\"corechart\"]});\n" +
"google.setOnLoadCallback(drawChart);\n" +
"function drawChart() {\n" +
"var data = google.visualization.arrayToDataTable([\n" +
"[\'Index\',\'Fahrenheit\',\'Celsius\'],\n" +
Data + // the data
"]);\n" +
"var options = { title: \'Record\',focusTarget:\'category\',pointSize:\'5\' };\n" + // Set options and point size=5.
"var chart = new google.visualization.LineChart(document.getElementById(\'chart_div\'));\n" +
"chart.draw(data,options);" +
"}</script>\n" +
"</head><body><div id=\"chart_div\" style=\"width: 640px; height: 420px;\"></div>" + // Chart frame size
"</body></html>", "utf-8");
} catch (Exception e){
e.printStackTrace();
}
return chartHtml;
}
- Within the thread, use the runOnUiThread() to update the UI:
Use the android webkit to draw graph.
import android.webkit.WebView;
import android.webkit.WebSettings;
runOnUiThread(new Runnable() {
public void run() {
//stuff that updates ui
//web view load data.
setContentView(R.layout.get_measurement_record_online);
mWebView = (WebView)findViewById(R.id.chartWebView);
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setSupportZoom(true);
webSettings.setLoadWithOverviewMode(true);
mWebView.setScrollBarStyle
(View.SCROLLBARS_OUTSIDE_OVERLAY);
// the function call to display chart
mWebView.loadDataWithBaseURL(null,chartHtml,"text/html","utf-8",null);
}
});
2) Play mp4 Video
Here is a simple example of clicking a button and playing a video from sdcard. we cannot use it in a separate thread. The actual video playback takes place in runOnUiThread().
public class GatsbyDemoActivity extends Activity
{
....
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// save the context for use later
context = this;
btnVideo = (Button)findViewById(R.id.btnVideo);
...
btnVideo.setOnClickListener(new View.OnClickListener()
{
@Override
public void onClick(View v)
{
vv = (VideoView) findViewById(R.id.videoView);
// get the Activity context for use within button OnClickListener
mc = new MediaController(context);
//System.out.println("video="+"play video1");
runOnUiThread(new Runnable() {
public void run() {
//stuff that updates ui
getWindow().setFormat(PixelFormat.TRANSLUCENT);
setContentView(R.layout.get_video);
mVideobackBtn =(
Button)findViewById(R.id.videoBackBtn);
mVideobackBtn
.setOnClickListener(btnBackOnClkLis);
//System.out.println("video="+"play video3");
vv=(VideoView)findViewById(R.id.videoView);
vv.setVideoPath("/sdcard/DCIM/Camera/GATSBY_MOVING_RUBBER.mp4");
mc.setMediaPlayer(vv);
vv.setMediaController(mc);
vv.requestFocus();
vv.start();
} //run
private Button.OnClickListener btnBackOnClkLis = new
Button.OnClickListener(){
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
// Back to the home menu
Intent intent = new Intent(vv.getContext(), GatsbyDemoActivity.class);
startActivity(intent);
}
}; //OnClickListener
}); //runOnUiThread
} //onClick
});
}
}
After that, you can play mp4 video, and click on the back button to go back to previous screen.
3) Screen orientation
In AndroidManifest.xml file, in activity section, set
android:screenOrientation="landscape"
to fix the display in landscape mode.
No comments:
Post a Comment