[Flash]AS3.0によるFlashの制作…基本構造
ActionScript3.0
オブジェクト指向とは
- オブジェクトとは…プロパティ(性質)とメソッド（行動）をもったひとつの塊
クラスとインスタンス
- オブジェクトの原型をクラス、そこからオブジェクトの複製を作ることをインスタンス化という
var mc:MovieClip = new MovieClip();- ↑MovieClip();は設計図にあたるクラス。new命令によってインスタンス化し、変数mcに代入。
プロパティとメソッド
クラスの継承
- プロパティやメソッドを別のクラスに引き継ぐことができる
- 「自動車」クラスを「乗用車」クラス、「クレーン車」クラスに継承する概念のイメージ
表示リスト…Flasｈの階層構造
- オブジェクトは「ステージ」の中に内包され、さらにそれぞれを
- 親はparent、子はchild、自身はthisで参照できる
階層構造
import flash.display.MovieClip; var MClipA: MovieClip = new Shikaku(); MClipA.x = 0; MClipA.y = 0; addChild(MClipA); var MClipB: MovieClip = new Sankaku(); MClipB.x = 50; MClipB.y = 50; addChild(MClipB); var MClipC: MovieClip = new Maru(); MClipC.x = 100; MClipC.y = 100; addChild(MClipC); var MClipD: MovieClip = new Hoshi(); MClipD.x = 200; MClipD.y = 0; MClipC.addChild(MClipD);
[PHP][SQL]データベースの構築①
データベースの構築
- XAMPPからApache,MySQLをStart
- phpMyadminを起動。
データベースの作成
- データベースを制作すると、テーブルに実際のデータが格納される。
- 個別テーブルをクリック＞タブ「表示」をクリックする。データはEcelのような表示。
データベースの追加
- 挿入タブから→データベース末尾に追加される
- 表示タブから→それぞれを直接編集できる
- 入力できる文字数の制限などは「構造」タブから設定できる
SQL
- データベースを操る言語、phpとは別物
- テーブルを選んだ状態でSQLタブを選択・基本構文４つ
- SELECT文
- DELETE文
- UPDATE文
- INSERT文
- CRUDの概念…create read update delete
SELECT文
- データを選ぶ
- 基本構文→SELECT カラム名 FROM テーブル名;
INSERT文
- 挿入
- 基本構文→INSERT INTO テーブル名 (挿入先カラム名) VALUES (値)※セミコロン不要
UPDATE文
- 更新 誤操作に注意！
- 基本構文→UPDATE
テーブル名SETカラム名= '値'; - どの行にたいして更新するか指定しないとカラムが1行まるごと更新されてしまう→WHERE句を使う
- 基本構文→UPDATE
テーブル名SETカラム名= '値' WHERE カラム名 = カラム番号; - シングルクォートとアポストロフィーの書き間違いに注意 runble1.com
DELETE文
- 削除 誤操作に注意！
- DELETE FROM
テーブル名WHEREカラム名=カラム番号;
データベースの制作まとめ
- データベース名をつけ、カラム数を設定する
- 一つ目のカラムは、データ型int インデックスをPRIMARYにしておく(主キー)さらにAIをチェック（autoIncrement、自動的に1加算）
- PRIMARY(主キー)には一意性の、それぞれが他と重複しないデータを設定する
- すなわち一つ目はデータ照合用の連番データとなる
- 文字を格納するカラムにはデータ型varchar（短い文字列型）、照合順序はutf8-general_ciに設定する、また文字数を設定
[PHP]フォームの制作…まとめ
構造
- index.php…フォームを記述、フォームをpostで送信
- check.php…送られた内容のチェック、合っていればsendへ、間違っていれば戻る
- send.php…メールの送信
- func.php…共通化できる関数をまとめ呼び出せるようにする
index.php
<?php require_once dirname(__FILE__).'/func.php'; $name =''; $email =''; $message =''; $name_error=''; $email_error=''; $message_error=''; if(isset($_SESSION['mail']['name'])){ $name = $_SESSION['mail']['name']; } if(isset($_SESSION['mail']['email'])){ $email = $_SESSION['mail']['email']; } if(isset($_SESSION['mail']['message'])){ $message = $_SESSION['mail']['message']; } if(isset($_SESSION['mail']['name_error'])){ $name_error = $_SESSION['mail']['name_error']; } if(isset($_SESSION['mail']['email_error'])){ $email_error = $_SESSION['mail']['email_error']; } if(isset($_SESSION['mail']['message_error'])){ $message_error = $_SESSION['mail']['message_error']; } ?> <!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="utf-8"> <title>お問い合わせフォーム</title> <style> span { color:red; } </style> </head> <body> <h1>お問い合わせフォーム</h1> <form action="check.php" method="post"> <table> <tr> <th><label for="name">お名前:</label>(20文字以内)</th><td><input type="text" name="name" id="name" value="<?php echo h($name);?>" maxlength="20" maxlength="20" size="50" placeholder="例：猫田猫男" required autofocus> <?php if(!empty($name_error)){ echo "<span>{$name_error}</span>"; } ?> </td> </tr> <tr> <th><label for="email">Eメール:</label>(25文字以内)</th><td><input type="email" name="email" id="email" value="<?php echo h($email);?>" maxlength="25" placeholder="例：example@example.com" size="50" required><?php if(!empty($email_error)){echo "<span>{$email_error}</span>";}?></td> </tr> <tr> <th><label for="message">お問い合わせ:</label>(150文字以内)</th><td><textarea name="message" id="message" maxlength="150" placeholder="例：資料を請求いたします。" cols="40" rows="5" required><?php echo h($message);?></textarea><?php if(!empty($message_error)){echo "<span>{$message_error}</span>";}?></td> </tr> </table> <input type="submit" value="確認"> </form> </body> </html>
check.php
<?php require_once dirname(__FILE__).'/func.php'; if(!isset($_POST['name'])||!isset($_POST['email'])||!isset($_POST['message'])){ header('Location:index.php'); exit; } $name = $_POST['name']; $email= $_POST['email']; $message = $_POST['message']; $success = true; $name_error=''; $email_error=''; $message_error=''; //＠がはいってるかのチェック if(strpos($email,'@')===false){ $email_error = '@マークがありません'; $success = false; } if(strlen($email)!=mb_strlen($email,'utf-8')){ $email_error = 'Eメールに全角文字が含まれています'; $success = false; } if(mb_strlen($name,'utf-8')>20){ $name_error = 'お名前が長すぎます'; $success = false; } if(mb_strlen($email,'utf-8')>25){ $email_error = 'Eメールが長すぎます'; $success = false; } if(mb_strlen($message,'utf-8')>150){ $message_error = 'お問い合わせ内容が長すぎます'; $success = false; } if(empty($name)){ $name_error= '名前が入力されてません'; $success = false; } if(empty($email)){ $email_error= 'Eメールが入力されてません'; $success = false; } if(empty($message)){ $message_error= 'お問い合わせ内容が入力されてません'; $success = false; } $_SESSION['mail']['name']= $_POST['name']; $_SESSION['mail']['email']= $_POST['email']; $_SESSION['mail']['message']= $_POST['message']; $_SESSION['success'] = $success; $_SESSION['mail']['name_error'] = $name_error ; $_SESSION['mail']['email_error'] = $email_error ; $_SESSION['mail']['message_error'] = $message_error ; if(!$success){ header('Location:index.php'); exit; } ?> <!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="utf-8"> <title>お問い合わせ確認</title> </head> <body> <h1>お問い合わせ確認</h1> <table> <tr> <th>お名前:</th><td><?php echo h($name);?> </td> </tr> <tr> <th>Eメール:</th><td><?php echo h($email);?></td> </tr> <tr> <th>お問い合わせ:</th><td><?php echo nl2br(h($message)); ?></td> </tr> </table> <p><a href="index.php">戻る</a></p> <p><a href="send.php">送信</a></p> </body> </html>
send.php
<?php require_once dirname(__FILE__).'/func.php'; if(!$_SESSION['mail']['success']){ header('Location:index.php'); exit; } $name = $_SESSION['mail']['name']; $email = $_SESSION['mail']['email']; $message = $_SESSION['mail']['message']; //配列の初期化 $_SESSION = array(); unset($_SESSION['mail']); if(isset($_COOKIE[session_name()])){ setcookie(session_name(),'',time()-42000,'/'); } session_destroy(); $body =<<<EOF {$name}様よりお問い合わせメールが送信されました。 内容は以下の通りです ****************************** {$message} {$name}様のメールアドレス：{$email} EOF; $r=mb_send_mail('xxxx@.com','お問い合わせメール',$body); ?> <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>メール送信終了</title> </head> <body> <h1>メール送信終了</h1> <p>以下内容のでメールが送信されました</p> <table> <tr> <th>お名前:</th><td><?php echo h($name);?> </td> </tr> <tr> <th>Eメール:</th><td><?php echo h($email);?></td> </tr> <tr> <th>お問い合わせ:</th><td><?php echo nl2br(h($message)); ?></td> </tr> </table> <p><a href="index.php">トップに戻る</a></p> </body> </html>
func.php
<?php function h($str){ return htmlspecialchars($str,ENT_QUOTES,'utf-8'); } session_start();
[jQuery] [jQuery]モバイル環境を考慮したタッチイベントの実装、onイベント、高速化テクニック
metaの記述
- 表示幅の設定、ズームの禁止
<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1,maximum-scale=1">
- 数列が電話番号として認識させない
<meta name="format-detection" content="telephone=no">
タッチできないPCを考慮したタッチイベントの設定
(function ($) { /* UAがタッチイベントをサポートしているかを判別 */ var isTouch = document.ontouchstart !== undefined; /*三項演算子 タッチ開始またはマウスダウンを返す*/ var start = isTouch ? 'touchstart' : 'mousedown'; var end = isTouch ? 'touchend' : 'mouseup'; /* onを利用して、変数に格納したイベントを指定する*/ /* hoverアクションをCSSで表現する */ $('#button').on(start, function () { $(this).addClass('hover'); }) .on(end, function () { $(this).removeClass('hover'); }); }(this.jQuery));
onイベント
- 複数のイベントを指定するなど多様な対応が可能になる app.codegrid.net
jQueryの高速化
[HTML][CSS]実践的コーディングにおける注意点
全般
HTML
- HTML内で、imgのwidth,heightは念のためつけておくこと。
- サイズを指定する際は奇数にならないよう注意すること。
- インデントのルールを統一すること。（タグで統一、半角スペ2つで統一など…）
- 機種依存文字(半角かな、囲み数字、＜＞など)は数値文字参照すること。
- marginの幅を改行で指定しない。（装飾指定はスタイルシートで行う原則）
CSS
- コーディング規約がある場合は遵守すること。とくに隠し文字など。
- CSSのセレクタはむやみに細かく指定しない…可読性の低下、優先順位が無駄に高くなるためあとで不都合が生じやすいため
- body #wrapper #nav ul li a → #nav li a のように、セレクタは右から読まれる性質を考慮し簡単に書く
- div#nav li.item a → #nav .item a のようにタグの種類を判別する必要がないときは略する
