狛ログ

2014年5月18日日曜日

StyleCopの設定 SA1650。

オフィス狛 技術部です。

弊社では、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用。

オフィス狛 技術部です。

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

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


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

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

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

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

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

*1 128×128、270×270、270×558、558×558

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

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


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

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

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

,

2014年5月2日金曜日

Webクリップの設定。

オフィス狛 技術部です。

今回は、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" という名前のファイルを置けばOKです。

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のみ)
日本語表記だと6文字が省略せずに表示されます。

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

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

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

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

, ,