2011年11月28日月曜日

バスナビ

先月から作っているバスナビアプリをβテスト登録してみました
http://www.sakasama.com/wp7beta/index.php

今のところ東急バスにしか対応していません。一応他のバス会社にも対応できるようにと考えていますが、バス情報はバス会社がそれぞれ独自に公開しているので、まとまったデータを取得する事ができなそうです。
バス会社毎にアプリで対応させていくのは大変なので、今後対応バス会社が増やせるかどうか???です。誰か手伝ってくれるといいなと思って、外部データを登録できるようにしています





















最終的には東急バスのバス運行情報ページを表示するのですが、モバイル向けに最適化されたページでは無いのを何とかしたいなと思ってますが、今のところ解決できていません。



ヘッダのメタタグでmeta name="viewport" content="width=device-width"を設定するとこんな感じになるのですが、よそ様のページにタグを突っ込むなんてどうやればいいのやら...
上の画像はiframeで東急バスのページを埋め込んでます、これだとスクロール動作がぎこちなくなって操作性が悪くなってしまう




2011年11月20日日曜日

アラームとカメラを使うアプリ

「2011年11月11日11時11分11秒を見逃すな」というアプリを公開しました。

http://windowsphone.com/s?appid=d8719221-93e1-4cc0-be2f-efcf5b85c727

指定した時間にアラームが鳴る機能と日付の焼きこんだ写真が撮れる機能を合わせたアプリです。

参考にしたページ

高橋 忍のブログ : アプリケーション自身のスクリーンキャプチャ機能の実装ブリリアントなWP7 : カメラで撮影した画像を保存する 画像ファイルを端末内に保存する
CH3COOH(酢酸)の実験室 : 静止画撮影を行う
です。特に高橋忍さんのページはコードをほぼコピーしている箇所があって、シャッターを押した後のメッセージ内容がまったく同じままにしてしまっていました。ごめんなさい。見る人が見れば、コピペしただけだろーと突っ込まれるかもしれないので、ここで白状しておきます

時計の表示を更新する部分も誰かの記述を参考にしましたが、どこだったか思い出せません




起動画面、アラームの設定と、カメラの撮影ページへの移行ができます

撮影した写真。画像サイズや撮影モードを切り替えたりとかはできません!ただシャッターボタンを押すだけです

時計部分のコードとXAMLをのっけておきます。
時計はタイマーで更新してます。文字の縁取りをするために数ピクセルずらした黒文字を4方向分の4回レンダリングしてます。(こんなんでいいのか?)
カメラの撮影は参考にしたコードをほぼそのままで、普通に撮影します。
撮影完了したら、写真の画像をlayoytrootの背景に描き出して、スクリーンキャプチャします

ほんとにこんなんで良いのか?って気もしますが、以上です。ここまでは数時間でできました。

一番時間がかかったのは、日時設定画面を作る事とアイコン作る事です。アイコンはちょっと画像がデカすぎたようです...


public partial class ClockPage : PhoneApplicationPage
    {
        bool nowCapturering = false;
        PhotoCamera camera = null;
        public ClockPage()
        {
            InitializeComponent();


            CameraButtons.ShutterKeyPressed += new EventHandler(CameraButtons_ShutterKeyPressed);
            DispatcherTimer tmr = new DispatcherTimer();
            tmr.Interval = TimeSpan.FromSeconds(1);
            tmr.Tick += new EventHandler(tmr_Tick);
            tmr.Start();
        }

        void camera_CaptureThumbnailAvailable(object sender, ContentReadyEventArgs e)
        {
            System.Diagnostics.Debug.WriteLine("camera_CaptureThumbnailAvailable");
        }

        void camera_CaptureImageAvailable(object sender, ContentReadyEventArgs e)
        {
            System.Diagnostics.Debug.WriteLine("camera_CaptureImageAvailable");
            this.Dispatcher.BeginInvoke(delegate()
            {
                BitmapImage bmp = new BitmapImage();
                bmp.SetSource(e.ImageStream);
                CaptureBrush.ImageSource = bmp;
                TakeCapture();
                nowCapturering = false;
            });
        }

        void camera_CaptureCompleted(object sender, CameraOperationCompletedEventArgs e)
        {
            System.Diagnostics.Debug.WriteLine("camera_CaptureCompleted");
        }

        void CameraButtons_ShutterKeyPressed(object sender, EventArgs e)
        {
            nowCapturering = true;
            camera.CaptureImage();
        }

        protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
        {
            camera = new PhotoCamera(CameraType.Primary);
            //camera.CaptureThumbnailAvailable += new EventHandler<contentreadyeventargs&rt;(camera_CaptureThumbnailAvailable);
            camera.CaptureImageAvailable += new EventHandler<contentreadyeventargs&rt;(camera_CaptureImageAvailable);
            camera.CaptureCompleted += new EventHandler<cameraoperationcompletedeventargs&rt;(camera_CaptureCompleted);
            nowCapturering = false;
            PreviewBrush.SetSource(camera);
            base.OnNavigatedTo(e);
        }

        protected override void OnNavigatingFrom(System.Windows.Navigation.NavigatingCancelEventArgs e)
        {
            if (camera != null)
            {
                camera.Dispose();
                camera.CaptureImageAvailable -= camera_CaptureImageAvailable;
                camera.CaptureCompleted -= camera_CaptureCompleted;
                camera = null;
            }
            base.OnNavigatingFrom(e);
        }

        void tmr_Tick(object sender, EventArgs e)
        {
            if (!nowCapturering)
            {
                textBlock1.Text = DateTime.Now.ToString("yyyy/MM/dd hh:mm:ss");
            }
        }

        private void TakeCapture()
        {
            WriteableBitmap bitmap = new WriteableBitmap(this.LayoutRoot, null);
            MemoryStream stream = new MemoryStream();

            bitmap.SaveJpeg(stream, bitmap.PixelWidth, bitmap.PixelHeight, 0, 80);

            using (MediaLibrary medialib = new MediaLibrary())
            {
                Picture pic = medialib.SavePictureToCameraRoll(DateTime.Now.ToString("yyMMddHHmmss"), stream.ToArray());
            }
            
            MessageBox.Show("Saved");
        }


xaml
<phone:PhoneApplicationPage 
    x:Class="Serial11.ClockPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Landscape" Orientation="Landscape"
    mc:Ignorable="d" d:DesignHeight="480" d:DesignWidth="728"
    Language="ja-JP"
    shell:SystemTray.IsVisible="True">

    <!--LayoutRoot は、すべてのページ コンテンツが配置されるルート グリッドです-->
    <Grid x:Name="LayoutRoot">
        <Grid.Background>
            <ImageBrush x:Name="CaptureBrush"/>
        </Grid.Background>
        <Grid x:Name="ContentPanel">
            <Rectangle x:Name="PreviewRectangle">
                <Rectangle.Fill>
                    <VideoBrush x:Name="PreviewBrush"/>
                </Rectangle.Fill>
            </Rectangle>
            <StackPanel HorizontalAlignment="Right" VerticalAlignment="Bottom" Orientation="Horizontal">
                <Grid Margin="0,0,10,0">
                    <TextBlock x:Name="textBlock3" Text="{Binding Text, ElementName=textBlock1}" VerticalAlignment="Top" FontFamily="Segoe WP Black" FontSize="48" Margin="0" HorizontalAlignment="Right" RenderTransformOrigin="0.5,0.5" Foreground="Black">
                        <TextBlock.RenderTransform>
                            <CompositeTransform TranslateX="3" TranslateY="3"/>
                        </TextBlock.RenderTransform>
                    </TextBlock>
                    <TextBlock x:Name="textBlock4" Text="{Binding Text, ElementName=textBlock1}" VerticalAlignment="Top" FontFamily="Segoe WP Black" FontSize="48" Margin="0" Foreground="Black" HorizontalAlignment="Right" RenderTransformOrigin="0.5,0.5" >
                        <TextBlock.RenderTransform>
                            <CompositeTransform TranslateX="-3" TranslateY="3"/>
                        </TextBlock.RenderTransform>
                    </TextBlock>
                    <TextBlock x:Name="textBlock5" Text="{Binding Text, ElementName=textBlock1}" VerticalAlignment="Top" FontFamily="Segoe WP Black" FontSize="48" Margin="0" Foreground="Black" HorizontalAlignment="Right" RenderTransformOrigin="0.5,0.5" >
                        <TextBlock.RenderTransform>
                            <CompositeTransform TranslateX="-3" TranslateY="-3"/>
                        </TextBlock.RenderTransform>
                    </TextBlock>
                    <TextBlock x:Name="textBlock6" Text="{Binding Text, ElementName=textBlock1}" VerticalAlignment="Top" FontFamily="Segoe WP Black" FontSize="48" Margin="0" Foreground="Black" HorizontalAlignment="Right" RenderTransformOrigin="0.5,0.5" >
                        <TextBlock.RenderTransform>
                            <CompositeTransform TranslateX="3" TranslateY="-3"/>
                        </TextBlock.RenderTransform>
                    </TextBlock>
                    <TextBlock x:Name="textBlock1" Text="----/--/-- --:--:--" VerticalAlignment="Top" FontFamily="Segoe WP Black" FontSize="48" Margin="0" Foreground="Yellow" HorizontalAlignment="Right" />
                </Grid>
            </StackPanel>
        </Grid>
    </Grid>
 
    <!--ApplicationBar の使用法を示すサンプル コード-->
    <!--<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>-->

</phone:PhoneApplicationPage>

2011年11月11日金曜日

2011年11月11日11時11分11秒を見逃すな

serial11.xap

windows phon7 用に"2011年11月11日11時11分11秒を見逃すな"というアプリを思いつきで作りました。

思いついたのが11月10日の朝だったので、マーケットへの審査に提出は全然間に合わないので、xapファイルだけアップしてみます。

これを書いてる時間も既に11月11日を回っているので、ちょーーと遅すぎですが.....


ベータ版なので不具合があったらごめんなさい、といってもダウンロードする人がいるか?という気もします



アプリを起動して、2011年11月11日11時11分11秒の5分前にアラームを登録することができて、日付と時間入りの決定的瞬間の写真を撮ることが出来るアプリです。

IS12Tでしか試してないです

当然11時11分の5分前を過ぎるとアラーム登録できないです。たぶん例外吐いて落ちると思います。



2011年11月8日火曜日

コマンドラインで配置配線のススメ

XILINXのFPGA合成ツールの話です。

ここではise12を使う事を前提に記事を書いてます。
すでにise13.3がリリースされている今なぜise12なの?と思うかもしれませんが、諸事情でise12を使い続けているから仕方がないのです。

これから書く内容はise13ではPlanAhedが使えるツールに進化していて、もう必要ないよって事かもしれませんが、僕の個人的な予想ではise13でもまだコマンドラインを使い続ける必要があるかなと思ってます

2011年11月7日月曜日

バスナビアプリ

iphoneやandroidにはバス接近情報表示するアプリがあるのですが、WindowsPhone7には今のところ無くて、これから先に誰かが作ってくれる可能性は低そうです。
(ローカル路線毎にはできるかもしれませんが、東急バスをサポートするアプリとなるとまず自分で作らないとだめかな)
なので、東急バスのバスナビページをwp7で見るアプリを作ってます

折角なので、東急バス以外のバス会社のページも表示できるような作りにしようと目論んで、バス会社選択ページがあります。
が、バス情報のページは各社ばらばらで、まとまった情報を得る手段はなさそうなので他社に対応できるかどうか怪しいです。

というか東急バスのページだけでもう気力がなくなりました。あぁぁ


アプリではwebページを取得して内容を解析してリストボックスに表示するような事をします。
htmlを解析する必要があるのですが、デバイスで解析させないでyqlを使ってみました。
リストを取得するのにいちいちyql経由でアクセスするのでちょっと動作が遅いですし、yql使ってアプリにしちゃって良いものかどうか?いまいちわかりません

yql使う利点は他の人が勝手にyqlのコードを書いて別会社のサービスを追加したりとか出来そうなところです。そのためにはバス会社情報のデータもweb上に置く必要があって、ホストを用意しなきゃいけないのですが

できたらβ版配布を試してみたいなと思ってますが、ローカルすぎて需要は0かも



ノッテちゃんのアイコン画像はまずいかな...

サービスの選択

路線一覧から選択する

これが最終的にたどり着くバス接近情報ページです。ここをスクレイピングしてGUI化する気力は残ってませんでした。でももう少しデバイスにフィットした表示したいんだけど、どうすれば良いのやら?

駅から路線を選択する

駅から路線選択で渋谷駅を選択したときの画面。ここもwebページそのまま。うまくスクレイピングできなかった。

バス停名称を入力してバス停を選択する画面

バス停を選択したときの画面

画面デザインをなんとかしないといけないですねー

2011年11月2日水曜日

QRコードメーカ


WindowsPhone7の標準で組み込まれているQRコードリーダは良くできてるなー、自分のアプリから使用するにはどうすればいいんだろう...とうい疑問から始まりましたが、ひとまず自分のアプリからQRコードを表示する方法を試してみました。

QRコード表示して何に使うか!は夢が広がりますが、やっぱりリーダも使えないと中途半端かな。
まぁいずれ解決されるでしょう。それはさておき


QRコードを表示するアプリを作る
他力本願なアプローチでなるべく簡単にします。
まずプロジェクトを作って、MainPageに

  1. TextBox
  2. Button
  3. Image

を配置します。 Image のSourceに以下のURLを指定します

http://chart.apis.google.com/chart?chs=300x300&cht=qr&choe=Shift_JIS&chl=http://nextgate.blogspot.com/
XAMLは下記のようになりました
<!--ContentPanel - 追加コンテンツをここに入力します-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0" Grid.RowSpan="2">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="0.817*"/>
    </Grid.RowDefinitions>
    <StackPanel>
        <TextBox x:Name="textBox1" Text="" AcceptsReturn="True" InputScope="Url" TextWrapping="Wrap" />
        <Button Content="作成" Click="Button_Click" />
    </StackPanel>
    <Image Margin="0" x:Name="image1" Stretch="Fill" d:LayoutOverrides="GridBox" Grid.Row="1" HorizontalAlignment="Center" Width="300" Height="300" Source="http://chart.apis.google.com/chart?chs=300x300&amp;cht=qr&amp;choe=Shift_JIS&amp;chl=http%3A%2F%2Fnextgate.blogspot.com%2F" />
</Grid>
という感じでUrlを指定します。


こんな感じになります。
なんかもうQRコードが表示されてて、完成したみたいです。

これだけだと使い道がないので、ユーザーが指定した文字列のQRコードを表示するようにしてみます。

”作成”ボタンを押したときのコードを記述します。ボタンをダブルクリックして以下のようにコードを追加します

private void Button_Click(object sender, RoutedEventArgs e)
{
    string url_base = "http://chart.apis.google.com/chart?chs=300x300&cht=qr&choe=Shift_JIS&chl={0}";

    string url = string.Format(url_base, Uri.EscapeDataString(textBox1.Text));

    image1.Source = new BitmapImage(new Uri(string.Format(url_base, textBox1.Text), UriKind.Absolute));

}

GoogleChart APIにテキストボックスの文字列を追加したURLを作成して、Imageのソースとして設定するコードです

これで完成





プロジェクトファイル QRMaker.zip