きちんとした、WebView の利用は Windows 8.1 + VS2013 で行ったほうがよさそうですが、API を使用したWEB アプリ関連のログイン処理はこれを使うしかありません。ほとんどたいした事はできませんが、テンプレートを作ってみました。 Windows ストア用に作ったイラストを 5 枚同梱しています。以下はそのうちの一つを使ったものです
イベントは、LoadCompleted で Navigate 後の処理を行う事ができます。 ページ内で JavaScript を実行するには、以下のようにすれば大抵は実行可能のようです。
this.webView.InvokeScript("eval", new[] { "history.back()" });
|
|
|
|
Chosen 選択すると、ボタンが追加されて複数選択を右手のマウスだけで行う事ができます。 必要なファイルは、js と css と chosen-sprite.png の3つのファイルだけです。
<script>
if ( !window.jQuery ) {
document.write("<"+"script src=\"https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js\"></"+"script>");
}
if ( window[window.location.hostname+'.loadChosen'] !== true ) {
window[window.location.hostname+'.loadChosen'] = true;
document.write("<"+"link rel=\"stylesheet\" href=\"https://winofsql.jp/jquery/plugins/chosen/chosen.css\">");
document.write("<"+"script src=\"https://winofsql.jp/jquery/plugins/chosen/chosen.jquery.min.js\"></"+"script>");
}
</script>
<script type="text/javascript">
$(function() {
// セレクタ
$(".chosen")
// プラグイン
.chosen({
width: "550px",
max_selected_options: 3
})
// 変更時のイベント
.change(function(evt, params){
console.log(evt.type);
if ( params.selected ) {
console.log(params.selected+" が選択されました");
}
if ( params.deselected ) {
console.log(params.deselected+" が選択解除されました");
}
})
// リストが開いた時のイベント
.on('chosen:showing_dropdown', function(evt, params) {
console.log(evt.type);
console.log(params);
})
// リストが閉じた時のイベント
.on('chosen:hiding_dropdown', function(evt, params) {
console.log(evt.type);
console.log(params);
})
// 最大値以上を選択した時に発生するイベント( リストは開かない )
.on('chosen:maxselected', function(evt, params) {
console.log("---------------");
})
;
}
);
</script>
<form>
<input type="submit" value="送信"><br>
<select name="sel_01[]" data-placeholder="あなたの好きな色を選択して下さい" multiple class="chosen">
<option value="0"></option>
<option value="1">赤</option>
<option value="2">緑</option>
<option value="3">青</option>
<option value="4">紫</option>
<option value="5">ピンク</option>
<option value="6">オレンジ</option>
<option value="7">黄色</option>
<option value="8">茶色</option>
</select>
<br><br>
<select name="sel_02" data-placeholder="あなたの好きな色を選択して下さい"class="chosen">
<option value="0"></option>
<option value="1">赤</option>
<option value="2">緑</option>
<option value="3">青</option>
<option value="4">紫</option>
<option value="5">ピンク</option>
<option value="6">オレンジ</option>
<option value="7">黄色</option>
<option value="8">茶色</option>
</select>
</form>
https?://.+? http で始まって、s が 0 または一つあって、:// 以降任意の文字(原則仕様的には改行以外) が一つ以上連続する最短の文字列 [\"']? URL の最後が、0 または 一つ の " か ' [;)>\\s] " や ' で終わらない場合の 他の必ず発生する文字 ; ) > スペース文字
(https?://.+?)[\"']?[;)>\\s]
C# のサンプル
MatchCollection mc = Regex.Matches(result, "(https?://.+?)[\"']?[;)>\\s]");
foreach (Match match in mc) {
sw.WriteLine( match.Groups[1] );
}
PHP のサンプル Java のサンプル
String regex = "(https?://.+?)[\"']?[;)>\\s]";
Pattern pattern = Pattern.compile(regex);
Matcher matcher = pattern.matcher(result_string);
while(matcher.find()){
System.out.println(matcher.group(1));
pw.println( matcher.group(1) );
}
標準クエリ演算子の概要
標準クエリ演算子は、統合言語クエリ (LINQ) パターンを形成するメソッドです。 ほとんどの場合、そのメソッドの操作の対象はシーケンスです。シーケンスとは、IEnumerable インターフェイスまたは IQueryable インターフェイスを実装している型を持つオブジェクトのことです 。 標準クエリ演算子には、クエリ機能が用意されています。たとえば、フィルター処理、射影、集計、並べ替えなどです。
データベースへのアクセスは SQL で実行しておいて、メモリにあるデータに対して LINQ を使用します。文字列の比較の為に、メソッドを一つ追加しています。
変数名に日本語を使用しているのは、テーブルの列定義が日本語の為です。変数を 英数字にするには、SELECT 構文で列に別名を付けて、格納用のクラスをその名前にします。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.IO;
using System.Data.Odbc;
using System.Data.Linq;
using System.Data;
namespace DataContextTest {
class Program {
static void Main(string[] args) {
OdbcConnection cn = null;
string cs = "Driver={MySQL ODBC 5.2w Driver};" +
"Server=localhost;" +
"Database=lightbox;" +
"Uid=root;" +
"Pwd=password;";
try {
cn = new OdbcConnection(cs);
// System.Data.Linq を参照
DataContext context = new DataContext(cn);
// select * from 社員マスタ で動作します
string query = String.Format("select 社員コード,氏名 from 社員マスタ");
// シーケンスとは、IEnumerable<T> インターフェイスまたは
// IQueryable<T> インターフェイスを実装している型を持つオブジェクト
IEnumerable<Syain> tables = context.ExecuteQuery<Syain>(query);
var q =
from s in tables
where comp(true,s.社員コード,"0005")
select s;
foreach (var s in q) {
Console.Write("{0}, {1}\n", s.社員コード, s.氏名);
}
}
catch (Exception ex) {
Console.WriteLine(ex.Message);
}
if (cn.State == ConnectionState.Open) {
cn.Close();
cn.Dispose();
}
Console.ReadLine();
}
// 文字列比較用
public static bool comp(bool type,string a, string b) {
if (a == b) {
return true;
}
if (a.CompareTo(b) < 0) {
return !type;
}
else {
return type;
}
}
private class Syain {
public string @社員コード { get; set; }
public string @氏名 { get; set; }
}
}
}
※ System.Data.Linq を参照して下さい 元々は、Windows Phone のテンプレートにあるバインド方法ですが、DataGrid にある AutoGenerateColumns プロパティはデフォルトで ON です。そもそも、こういう目的に使えるようにできています。 テーブル定義用のクラスは、ObservableCollection<T> でまとめられる必要があるので、ExecuteQuery
の結果を使って ObservableCollection<T> を作り直して DataContext に設定します。その際、ItemsSource は、{Binding} である必要があります。 ※ 社員マスタの列はもっとたくさんあります MainWindow.xaml
<Window x:Class="WpfDataGrid.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<DataGrid
Height="217"
HorizontalAlignment="Left"
Margin="54,56,0,0"
Name="dataGrid1"
VerticalAlignment="Top"
Width="399"
AutoGenerateColumns="True"
ItemsSource="{Binding}" />
<Button
Content="Button"
Height="24"
HorizontalAlignment="Left"
Margin="55,17,0,0"
Name="button1"
VerticalAlignment="Top"
Width="113"
Click="button1_Click" />
</Grid>
</Window>
MainWindow.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Data;
using System.Data.Odbc;
using System.Diagnostics;
using System.Data.Linq;
using System.Collections.ObjectModel;
namespace WpfDataGrid
{
public partial class MainWindow : Window
{
private OdbcConnection cn = null;
public MainWindow()
{
InitializeComponent();
}
private class Syain
{
public string @社員コード { get; set; }
public string @氏名 { get; set; }
}
private void button1_Click(object sender, RoutedEventArgs e)
{
string cs = "Driver={MySQL ODBC 5.2 Unicode Driver};" +
"Server=localhost;" +
"Database=lightbox;" +
"Uid=root;" +
"Pwd=password;";
string query = String.Format("select 社員コード,氏名 from 社員マスタ where 社員コード >= '{0}'", "0005");
try {
cn = new OdbcConnection(cs);
DataContext context = new DataContext(cn);
this.dataGrid1.DataContext =
new ObservableCollection<Syain>(
context.ExecuteQuery<Syain>(query)
);
}
catch( Exception ex ) {
Debug.WriteLine(ex.Message);
}
if ( cn.State == ConnectionState.Open ) {
cn.Close();
cn.Dispose();
}
}
}
}
ただ、VS2010 では、バグがあるようで、行が1行多く作成されてしまいます。VS2012 ではうまく行くんですが・・・。それと、ExecuteQuery の変数バインド機能は動作しませんでした。 CanUserAddRowsを 意図的に false にする必要があります。( デフォルトが true でした )。後、セル内の編集が必要無いのであれば、IsReadOnly を true にしてもかまいません。
ページのトップレベルで定義される変数は、window["変数名"] で参照する事ができます。
ここでは、変数に対して直接 JSON を記述していますが、外部で定義したテキストを jQuery のajax で取得して JSON オブジェクトを使用するともっと自由度の高いイベント登録をする事ができます
▼ JSON 文字列変換例
alert( JSON.parse('{"abc":"こんにちは"}').abc );
<script>
if ( !window.jQuery ) {
document.write("<"+"script src=\"//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js\"></"+"script>");
}
</script>
<script>
var event_lst = {
"target_a" : function() {
alert(this.id);
// this はイベントを起こした要素
console.dir(this);
},
"target_b" : function() {
alert(this.id);
},
"target_c" : function() {
alert(this.id);
},
"target_d" : function() {
alert(this.id);
},
"target_e" : function() {
alert(this.id);
}
};
$(function(){
$( ".event_lst" ).each(function(index) {
// this は参照した DOM
$( this ).val(this.id);
// event_lst の function をイベントに登録
// var event_lst は トップで定義しているので、
// window["event_lst"] で参照できます
$( this ).click( window[this.className][this.id] );
});
});
</script>
<input class="event_lst" type="button" id="target_a"><br>
<input class="event_lst" type="button" id="target_b"><br>
<input class="event_lst" type="button" id="target_c"><br>
<input class="event_lst" type="button" id="target_d"><br>
<input class="event_lst" type="button" id="target_e"><br>
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定＞ 詳細設定＞ ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。 Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。 また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。 ※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです 対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。※ エキスパートモードで表示しています アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります
<% if:page_name eq 'archive' -%> アーカイブページでのみ表示される内容 <% /if %> <% if:page_name eq 'category' -%> カテゴリページでのみ表示される内容 <% /if %> <% if:page_name eq 'tag' -%> タグページでのみ表示される内容 <% /if %>この記述は、以下の場所で使用します
|
|
