狛ログ

2014年6月11日水曜日

CodeIgniterのActiveRecord（SQL関数利用時の別名について）。

6月 11, 2014
オフィス狛　技術部です。

オフィス狛では、PHP開発を行う際は規模によって使用するフレームワークを変えています。

中・大規模の場合は、Symfony2を主に利用し、
Web APIや、簡単なメンテナンス系画面を作成する際は、
軽量フレームワークのCodeIgniterを利用しています。

今回は、CodeIgniterのActiveRecordで、苦労した問題を備忘録として残しておきます。

CodeIgniterのActiveRecordには、関数がいくつか用意されています。

  • select_max(field, alias)
    • クエリの "SELECT MAX(field)" の部分を書き出します。 結果フィールドをリネームするために、追加で第2引数を指定できます。
  • select_min(field, alias)
    • クエリの "SELECT MIN(field)" の部分を書き出します。select_max() と同様に、結果フィールドをリネームするために、追加で第2引数を指定できます。
  • select_avg(field, alias)
    • クエリの"SELECT AVG(field)" の部分を書き出します。 select_max() と同様に、結果フィールドをリネームするために、追加で第2引数を指定できます。
  • select_sum(field, alias)
    • クエリの"SELECT SUM(field)"の部分を書き出します。select_max() と同様に、結果フィールドをリネームするために、追加で第2引数を指定できます。

例えば、select_maxの使い方は以下の通りです。
$keyMaxId = 0;

$selectmax = array(
        'key_id',
        'item_div',
);
$this->db->select_max('key_id', 'maxId');;
$this->db->from('sample_table');
$this->db->where('item_div', $this->config->item('item_div'));
$querymax = $this->db->get();
$productmax = $querymax->row(0, 'object');

if (count($productmax) > 0) {
    $keyMaxId = $productmax->maxId;
    $keyMaxId++
}

return $keyMaxId;
上記は、テーブル（sample_table）のキー（key_id）のMAX値を取得して、
１加算して値を返却する処理ですが、
実は、上記だと実行時エラーになってしまいます。
原因は「select_maxの第２引数のalias(別名)」にあります。

関数の第２引数のalias(別名)は『全て小文字』で設定しないといけません。
上記例で言うと、「maxId」ではなく、「maxid」と記載するのが正解です。

こういった細かいミスは気付き難いです・・・・。

2014年6月10日火曜日

Entity Framework 5におけるデータバインド。

6月 10, 2014
オフィス狛　技術部です。

Entity Framework 4.xを利用しているシステムをリニューアルする事になり、
.NET Frameworkのバージョンを上げ、Entity Framework も 5 にバージョンアップさせました。

その状態で実行すると、

Data binding directly to a store query (DbSet, DbQuery, DbSqlQuery) is not supported Entity Framework 5

というエラーメッセージが表示されました。
日本語環境だと、

ストア クエリ (DbSet、DbQuery、DbSqlQuery) への直接のデータ バインドはサポートされていません。代わりに、DbSet で Load を呼び出すなどして DbSet にデータを設定し、ローカル データにバインドしてください。WPF の場合は DbSet.Local に、WinForms の場合は DbSet.Local.ToBindingList() にバインドします

と表示されました。

元々のプログラムは単純で、
テーブルから取得したデータをドッロプダウンリストにバインドしているだけです。
using (var context = new DeomDbEntities())
{
  var testObject =
      from master in context.code_name
      where master.code_type == '1' &&
            master.delete_flg == '0'
      orderby master.display_order
      select new { code_value = master.code_value, code_text = master.code_text };

  if (testObject != null)
  {
      dropDownList.DataSource = testObject;
      dropDownList.DataValueField = "code_value";
      dropDownList.DataTextField = "code_text";
      dropDownList.DataBind();
  }
}
日本語のエラーメッセージが分かり難かったのですが、
要は「クエリを直接データソースに設定するな」という事だとだと思い、

dropDownList.DataSource = testObject;

上記部分を

dropDownList.DataSource = testObject.ToList();

と変更する事で、エラーメッセージが表示されなくなりました。
ヒントとなる情報は国内サイトでは見つかりませんでしたが、
Stack Overflowで発見しました。
（プログラムでハマってしまった時に検索すると、大抵「Stack Overflow」に行き着きますよね・・・）
修正後のプログラムは以下に記載しておきます。
using (var context = new DeomDbEntities())
{
  var testObject =
      from master in context.code_name
      where master.code_type == '1' &&
            master.delete_flg == '0'
      orderby master.display_order
      select new { code_value = master.code_value, code_text = master.code_text };

  if (testObject != null)
  {
      dropDownList.DataSource = testObject.ToList();
      dropDownList.DataValueField = "code_value";
      dropDownList.DataTextField = "code_text";
      dropDownList.DataBind();
  }
}
余談ですが、Entity Frameworkのバージョンに関する情報は下記サイトが参考になりました。
Entity Framework の歴史を振り返る

2014年5月18日日曜日

StyleCopの設定 SA1650。

5月 18, 2014
オフィス狛　技術部です。

弊社では、C#でプログラミングする際は、必ず StyleCop を利用しています。

StyleCop は、C#のコーディング内容をチェックするツールです。
インストールはNuGetのパッケージ管理で行っているので、下記などを参照下さい。

StyleCopインストール手順メモ

今回は、使い方の説明ではなく、日本語特有の問題についての解決方法です。

「StyleCopのインストール」というサイトにもある通り、
SA16xx系は、日本語環境では実用的では無いので、無効にする事がほとんどです。

ところが、SA1650だけ、設定画面で無効に出来ない。
（SA1650がない！？）

そのままビルドすると、大量に警告が出ます。
警告 xxxx SA1650 : CSharp.Documentation : The documentation text within the summary tag contains incorrectly spelled words
というわけで、SA1650を無効にする為には、クラス属性を指定する必要があります。
[SuppressMessage("StyleCop.CSharp.DocumentationRules", "SA1650:ElementDocumentationMustBeSpelledCorrectly",Justification = "For Japanese support")]
class SampleClass
{ 
}

こんな感じで、初期設定は色々と面倒ですが、StyleCopを導入すると、
プロジェクトのメンバーそれぞれのプログラムに統一性が出て、
後々見直しても、プログラムの中身が理解し易いのでお勧めです。

※追記
今回使用していたのは、NuGetからインストールしたバージョン「4.7.46.0」ですが、
NuGetを使用せずに、本家サイトから直接インストーラーをダウンロードして、
インストールした「4.7.49.0」だと、SA1650は設定画面にも表示されました。

2014年5月9日金曜日

Webクリップの設定　Windows8用。

5月 09, 2014
オフィス狛　技術部です。

前回、androidとiosのWebクリップ設定を行いましたが、
今回はWindows8のピン留めについてです。

弊社ホームページで、試しにWebクリップの設定をしていない状態でピン留めしてみました。
すると、Webサーバのエラーログに、
File does not exist: xxxxxx/xxxxxx/browserconfig.xml
という内容が出力されていました。
ちなみに、ピン留めした時の状態は、


タイルの真ん中の画像はどうやらfaviconのようです。
タイルの色も、faviconの色が基調になっているようです。
タイルのサイズは、２種類（中と小）しか選ぶ事が出来ませんでした。

では、Webクリップの設定をしていきましょう。

と言うものの、実際は、下記URLで画像とXMLファイルを自動生成できます。

Web サイトを Windows 8.1 のタイルにしよう - Web サイトをピン留めする

基本は手順に沿って進めていけば問題ありません。
画像は、アップロードした画像を元に、４サイズ分(*1)作成されるので、
アップロードした画像のトリミングを４サイズ分行います。

*1 128×128、270×270、270×558、558×558
RSSフィードの設定する事で、ライブタイルのプッシュ通知が可能になります。

最終的に自動生成された（ダウンロードしたパッケージの）browserconfig.xmlと画像を
ドキュメントルートに置いて、htmlのmetaタグに下記を追加すれば完了です。
（画像のパスなど、その他の設定は全てbrowserconfig.xmlに記載してあります。）
<meta name="application-name" content="オフィス狛"/>
設定した後にピン留めした結果は以下の通りです。


ピン留めした画像サイズの変更も、４種類から選ぶ事が可能になっています。

前回と今回で、Webクリップの設定を行いました。

余談ですが、Windows8.1タブレットでスクリーンショット（画面キャプチャ）は、
タブレット本体にあるWindowsボタンを押しながら、音量のマイナスを押すと取れます。

2014年5月2日金曜日

Webクリップの設定。

5月 02, 2014
オフィス狛　技術部です。

今回は、Webクリップ（apple-touch-icon.png）についてです。

先日、社内Webシステムのエラーログに、
File does not exist: apple-touch-icon.png
という内容が出力されていました。

"apple-touch-icon.png" はWebクリップといって、
スマホやタブレットでホーム画面にブックマークを表示する際のアイコンの事です。
社内システムではPCのみを対象としていたので、特に用意していませんでした。
オフィス狛のホームページではWebクリップは用意してあります。


上記はAndroid端末で見た場合ですが、左側がWebクリップを用意した場合で、
右側が用意していない場合です。



上記はios7の場合です。画像なしの場合は、サイトのキャプチャがアイコンになります。

設定方法ですが、Androidの事を考えないのであれば、
ドキュメントルートに "apple-touch-icon.png" という名前のファイルを置けばＯＫです。

Androidでは、以下の記述をhtmlファイルに追加する必要があります。（iosでも指定する事は可能）
<link href="apple-touch-icon.png" rel="apple-touch-icon"></link>
角丸処理は自動で行ってくれます。
rel の "apple-touch-icon" を "apple-touch-icon-precomposed" にすると、光沢無しの画像になりますが、
ios7からはフラットデザインになっている為、"apple-touch-icon"としても光沢処理は付かないようです。

ちなみに、
<meta name="apple-mobile-web-app-title" content="オフィス狛">
上記メタタグを追加する事で、アイコンの名称も設定する事ができます。（iosのみ）
日本語表記だと６文字が省略せずに表示されます。

Webクリップの画像サイズですが、
iOSヒューマンインターフェイスガイドラインによると、

iPhoneおよびiPod touchでは、次のサイズのアイコンを作成します。
  • 120×120ピクセル
  • 60×60ピクセル（標準解像度）

iPadでは、次のサイズのアイコンを作成します。
  • 152×152ピクセル
  • 76×76ピクセル（標準解像度）

との事です。
（昔は144pxとか114pxと言われていたけど変わった？）
画面サイズごとにリサイズされるので、一番大きい152pxで作成しておけば良いかと思います。

2013年7月7日日曜日

C# Array.ForEach内でのbreak、continue、return。

7月 07, 2013
オフィス狛　技術部です。

前々回の記事「C#でモダンプログラミング」の続きです。

記事内では、最終的にArray ForEachを利用した繰り返し処理を行っていましたが、
Array ForEachは、繰り返し処理内でのbreak、continue、returnは使用できません。

例えば、以下のような処理があったとします。
int[] nums = new int[] { 1, 3, 4, 9, 12, 14, 15, 19, 20, 23, 28 };

int result = 0;
foreach (int num in nums)
{
    if (num > 20)
    {
        break;
    }
    else
    {
        result += num;
    }
}

ソートされた配列内で、値が20以下の場合、値を足し込み、20より大きい値が存在した時点で、
繰り返し処理を終了しています。

これをArray.ForEachで書き換えて、以下のようにするとコンパイルエラーになります。
  int[] nums = new int[] { 1, 3, 4, 9, 12, 14, 15, 19, 20, 23, 28 };
  int result = 0;
  Array.ForEach<int>(nums, num =>
      {
          if (num > 20)
          {
              break;        //コンパイルエラー
          }
          else
          {
              result += num;
          }
      }
  );

では、どうすれば良いのか？
方法は色々あると思いますが、「配列内の20以下の値を足し込む」では無く、
「配列から20以下の値を抽出し、抽出した値を全て足し込む」で対応してみます。

匿名メソッド（ラムダ式）では以下のようになります。
int[] nums = new int[] { 1, 3, 4, 9, 12, 14, 15, 19, 20, 23, 28 };
int[] findnums = Array.FindAll(nums, num => num <= 20);
int result = 0;
Array.ForEach(findnums, num => result += num);

LINQでは以下の通りです。
int[] nums = new int[] { 1, 3, 4, 9, 12, 14, 15, 19, 20, 23, 28 };
var query = from num in nums
            where num <= 20
            select num;
int[] findnums = query.ToArray();
int result = 0;
Array.ForEach(findnums, num => result += num);

ちなみに、今回はArray.ForEachに視点を当てているので、
匿名メソッドやLINQも冗長な書き方になっています。
今回のプログラムの仕様(条件判断して数値を足し込む)を満たしたいのであれば、
通常は匿名メソッドやLINQの集計演算子（SUM）を使用します。

2013年6月22日土曜日

Twitterウィジェットの設定。

6月 22, 2013
オフィス狛　技術部です。

先日6月11日に、Twitter API Version 1.0の提供が終了しました。
（2012年8月時点でアナウンスはされていて、今までは移行期間だったので、
そこまで話題にはなっていませんでしたが。）

弊社ホームページでは、API 1.1には移行せずに、
API 1.0提供終了時点でツイート表示も廃止する予定でした。
廃止する一番の理由としては、「ツイート、タイムライン表示の方式規定 *1」によるものです。

*1 公式ドキュメントのDeveloper Display Requirementsにある通りに表示する必要があり、
今まで独自レイアウトで表示していたものが、使用出来なくなるからです。

API 1.0終了に対する簡単な対応としては、ウィジェットがあります。
指定のURLを自分のサイトへ貼り付けるだけで、タイムライン表示が可能となります。

Twitterへログインし、「設定」 > 「ウィジェット」で作成可能です。



基本的には、上記で作成した後、コードを自分のサイトへ貼り付けるだけなのですが、
コードに手を加える事で、細かい設定を行う事が可能です。

カスタマイズするのは以下の部分です。
<a class="twitter-timeline" href="https://twitter.com/username" data-widget-id="xxxxxx">

幅と高さについて

width、heightを指定する事で、自由に変更する事が可能です。
<a class="twitter-timeline" width="520" height="200" href="https://twitter.com/username" data-widget-id="xxxxxx">
ちなみに、指定出来る最小の幅は180px、最大の幅は520pxです。
最小の高さは200pxです。


表示ツイート数について

data-tweet-limitで、、表示するツイート数を指定できます。
以下の例では、ツイート数を1件に指定しています。
<a class="twitter-timeline" data-tweet-limit="1" href="https://twitter.com/username" data-widget-id="xxxxxx">


表示UIについて

data-chrome属性に以下のオプションを指定する事で、UIを変更出来ます。
オプションは、複数同時に設定する事が可能です。

noheader
　ヘッダー（フォローボタンがある部分）を非表示にします。
nofooter
　フッター（ツイート用テキストボックスがある部分）を非表示にします。
noborders
　ウィジェットの枠線、ツイート毎の境界線を非表示にします。
transparent
　ウィジェットの背景を透明にします。

全て設定した場合の例は以下の通りです。
<a class="twitter-timeline" data-chrome="noheader nofooter noborders transparent" href="https://twitter.com/username" data-widget-id="xxxxxx">

その他

上記設定の他にも、「data-theme」でタイムラインのテーマ、
「data-link-color」でリンクの文字色、「lang」で言語設定などが可能です。
※詳細は、公式ドキュメントに記載されています。

弊社ホームページでも、廃止予定だったツイートの表示をウィジェットで代替しています。

登録: 投稿 (Atom)

Recent Posts

Posts