Tutorial Video
Hardware
- PHPoC Blue (+ USB WLAN) or PHPoC Black (+ Ethernet cable)
- Micro USB to USB Cable (to upload source code to PHPoC Device)
- Touch Sensor
- Jumper wires
About Touch Sensor
Touch sensor is used to detect the touch of finger. The touch sensor used in this example includes three pins:
- VCC pin.
- GND pin.
- Signal pin (outputs digital signal).
- If sensor is touched by finger, value of the sensor's signal pin is HIGH (VCC).
- Otherwise, value of sensor's signal pin is LOW (0 V).
- By reading value of sensor's signal pin, we can infer state of touch sensor. To read value of sensor's signal pin, we just need to connect the sensor's signal pin to PHPoC device's input pin and use PHPoC code to read the value.
- Grove touch sensor (for more convenience, use it in combination with PHPoC Grove Expansion Board).
Wiring Diagram

Quick Steps
Source code of this example is a part of PHPoC Support Packet (PSP). You need to:
- Download PHPoC Support Package.
- Upload example\p4s\03.html_image\01.uio_touch_sensor to PHPoC Blue/Black.
- Configure network parameters (e.g. WiFi SSID, password, IP address ...).
- Access webpage on PHPoC using Web Browser on your PC or smart phone (See How To).
Source Code
Source files includes:
- index.php: this file contains source code of web page.It is only run in response to request from Web Browser.
- uio_touch_sensor.jpg: Wring diagram between PHPoC devices and touch sensor. It is displayed on webpage.
index.php
[Full Code]
PHP Code:
<html>
<head>
<title>PHPoC / <?echo system("uname -i")?></title>
<meta name="viewport" content="width=device-width, initial-scale=0.5">
<style> body { text-align: center; } </style>
</head>
<body>
<h2>
UIO / Catalex Touch Sensor<br>
<img src="uio_touch_sensor.jpg"><br>
<?php
include_once "/lib/sd_340.php";
define("IN_PIN", 0);
uio_setup(0, IN_PIN, "in");
$touch = uio_in(0, IN_PIN);
if($touch)
echo "touch ON<br>\r\n";
else
echo "touch OFF<br>\r\n";
?>
<br><a href="index.php">reload</a><br>
</h2>
</body>
</html>
[Explanation]
Source code of index.php file is composed of HTML, CSS and PHPoC code.
PHPoC code is interpreted on on PHPoC device.
-
PHP Code:
<?php
include_once "/lib/sd_340.php";
define("IN_PIN", 0);
uio_setup(0, IN_PIN, "in");
$touch = uio_in(0, IN_PIN);
if($touch)
echo "touch ON<br>\r\n";
else
echo "touch OFF<br>\r\n";
?>
- Setup IO pin. which connected to the sensor to input mode.
- Read value of input pin.
- Print state of touch sensor based on value of input pin to webpage.
PHPoC code may add/update the content of HTML, CSS or JavaScript code. Once PHPoC code is interpreted in PHPoC, the remaining code is client-side code and it is returned to Web Browser. Web Browser receives this code and interpret it to display the webpage.
- HTML: describes the structure of Web pages
- CSS: describes how HTML elements are to be displayed
See Also
- Touch Sensor - How to Use Touch Sensor.
- Touch Sensor - Monitoring Touch Sensor from Webpage using Hypertext.
- Touch Sensor - Monitoring Touch Sensor via WebSocket.
Other Resources