2019年1月14日 (月)

[C# wpf]TextBlockにてURL表示

wpfではTextBlockを用いるとハイパーリンクを設定することができます。
少量のデータでURLリンクを設定したく、ネット検索したところ以下のブログエントリがヒットしました。

WPF – TextBlockでのURLアドレスの検出とHyperlinkの改行
http://astel-labs.net/blog/diary/2012/05/03-1.html

データバインディングにも対応しているとのことで優れていると思われますが、バインディング不要の場合にごく簡単に記述してみました。

まず「プロジェクト」ー「クラスの追加」より以下のクラスを作成します。
TextBlockRun.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Text.RegularExpressions;
using System.Windows.Controls;
using System.Windows.Documents;

namespace TextBlockHyperLink
{
    class TextBlockRuns
    {
        public enum Attr { normalString, URI }

        public string String { get; set; }
        public Attr Attribute { get; set; }

        public TextBlockRuns(string str, Attr attr)
        {
            String = str;
            Attribute = attr;
        }

        public static List<TextBlockRuns> CreateHyperLinkList(string text)
        {
            var HLList = new List<TextBlockRuns>();
            splitRegex(
                text,
                @"http(s)?://([\w-]+\.)+[\w-]+(/[A-Z0-9-.,_/?%&=]*)?",
                HLList);
            return HLList;
        }

        private static void splitRegex(string text, string regexp, List<TextBlockRuns> HLList)
        {
            var regex = new Regex(regexp, RegexOptions.IgnoreCase | RegexOptions.Singleline);
            var match = regex.Match(text);
            if (match.Success)
            {
                string prestring = text.Substring(0, match.Index);
                string matchedstring = match.Value;
                string poststring = text.Substring(match.Index + match.Length);

                if (!string.IsNullOrEmpty(prestring))
                {
                    HLList.Add(new TextBlockRuns(prestring, TextBlockRuns.Attr.normalString));
                }
                HLList.Add(new TextBlockRuns(matchedstring, TextBlockRuns.Attr.URI));

                splitRegex(poststring, regexp, HLList);
            }
            else
            {
                if (!string.IsNullOrEmpty(text))
                {
                    HLList.Add(new TextBlockRuns(text, TextBlockRuns.Attr.normalString));
                }
            }
        }

        public static void FillHyperLinks(TextBlock tb, List<TextBlockRuns> TBRList)
        {
            foreach (TextBlockRuns TBRuns in TBRList)
            {
                switch (TBRuns.Attribute)
                {
                    case TextBlockRuns.Attr.normalString:
                        {
                            Run run = new Run(TBRuns.String);
                            tb.Inlines.Add(run);
                            break;
                        }
                    case TextBlockRuns.Attr.URI:
                        {
                            Run run = new Run(TBRuns.String);
                            Hyperlink hyperl = new Hyperlink(run);
                            try
                            {
                                hyperl.NavigateUri = new Uri(TBRuns.String);
                                tb.Inlines.Add(hyperl);
                            }
                            catch (Exception)
                            {
                                tb.Inlines.Add(run);
                            }
                            break;
                        }
                }
            }
        }
    }
}

MainWijndow.xamlの例
<Window x:Class="TextBlockHyperLink.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:TextBlockHyperLink"
        mc:Ignorable="d"
        Title="MainWindow" Height="300" Width="400" Loaded="WindowLoaded">
    <Grid>
        <ScrollViewer VerticalScrollBarVisibility="Auto">
            <TextBlock x:Name="sampleTextBlock" TextWrapping="Wrap"
                       Hyperlink.RequestNavigate="RequestNavigateEventHandler" />
        </ScrollViewer>
    </Grid>
</Window>

MainWindow.xaml.csの例
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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;

namespace TextBlockHyperLink
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void WindowLoaded(object sender, RoutedEventArgs e)
        {
            string tmpString = "This sample is \n"
                            + "forhttps://www.example.com/ and\n"
                            + "https://www.example.com/?tmp . Hello World!";

            sampleTextBlock.Text = "";
            TextBlockRuns.FillHyperLinks(sampleTextBlock, TextBlockRuns.CreateHyperLinkList(tmpString));
        }

        private void RequestNavigateEventHandler(object sender, RequestNavigateEventArgs e)
        {
            System.Diagnostics.Process.Start(e.Uri.AbsoluteUri);
        }
    }
}

Textblockurl

| | コメント (0) | トラックバック (0)

[C# wpf]三角形のボタンを作成する方法

Windowsデスクトップアプリケーションを作成するにあたり、wpfを利用すればリッチな(使って楽しい)UIが比較的簡単に作れるように思いますが、奥が深いというか、Windows Formsの情報と混同しやすかったり、.NETのバージョンによってもうまく動いたりそうでなかったりがあるようで、ともするとトライ&エラーの世界になっているような気がします。(^^;

さて、日付時刻の入力補助のために三角形のボタンを作成したくネットを検索したところ、以下のブログに詳しく書かれておりました。

ただしマウスオーバー時に形を変えるなど凝った動きをするようですので(これはこれで素晴らしい)、必要最小限の三角形の形をしただけのボタンを作ってみました。

(Visual Studio 2017, .NET Framework 4.6.1にて確認)

まず「プロジェクト」ー「リソースディクショナリの追加」からファイルを追加して(Dictionary1.xaml)、以下のように記述します。
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:triangleButton">
    <Style x:Key="TriangleButton" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Grid>
                        <Polygon x:Name="ButtonTriangle" Points="0,20 15,0 30,20 0,20"
                                Stroke="{DynamicResource {x:Static SystemColors.ControlDarkDarkBrushKey}}" StrokeThickness="1">
                            <Polygon.Fill>
                                <SolidColorBrush Color="{DynamicResource {x:Static SystemColors.ControlLightColorKey}}"/>
                            </Polygon.Fill>
                        </Polygon>
                        <ContentPresenter Margin="0,6,0,0" TextBlock.FontSize="12"
                                          TextBlock.TextAlignment="Center">
                        </ContentPresenter>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="true">
                            <Setter Property="Path.Fill" Value="{DynamicResource {x:Static SystemColors.ActiveCaptionBrushKey}}" TargetName="ButtonTriangle" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

MainWindow.xamlは以下のように
<Window x:Class="triangleButton.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:triangleButton"
        mc:Ignorable="d"
        Title="MainWindow" Height="300" Width="400">
    <Window.Resources>
        <ResourceDictionary Source="Dictionary1.xaml"/>
    </Window.Resources>
    <Grid>
        <Button Style="{StaticResource TriangleButton}" Click="triangleButton_Click" />
    </Grid>
</Window>

一応MainWindow.xaml.csも載せておきます。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
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;

namespace triangleButton
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void triangleButton_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show("Hello World");
        }
    }
}
Triangle_example

| | コメント (0) | トラックバック (0)

2015年6月 7日 (日)

LiveShell Pro配信停止から初期化する手順

CEREVO LiveShell Proは内部にUSTREAMなどへの接続情報を保持するつくりになっているので、モバイル利用に適しています(事前に設定しておいて、電源を入れるだけで配信開始できる)が、別のチャンネルに接続するときや、レンタル品を返却する場合は初期化が必要です。

LiveShell Dashboardで配信停止してからLiveShell Proを初期化して電源オフするまでの手順をまとめました。

以下の順でLiveShell Pro本体のボタンを押します。

 

左下→右下→右上→左下→右上→右下→右上→右上→左上→左上→左下

 

以上! (^^;

詳細はこちら↓

「liveshellpro1.pdf」をダウンロード

「liveshellpro2.pdf」をダウンロード

「liveshellpro3.pdf」をダウンロード


| | コメント (0) | トラックバック (0)

2015年2月 8日 (日)

Jimdoで画像スライドショーをスマートフォン対応にする方法 (jQuery Cycle 後継の Cylcle2を使う)

これまでJimdoでスライドショーを入れるとき、たとえば以下のサイトに記載された方法が利用できます。

【みんビズ Jimdoでもう少し柔軟なjQueryスライドショーを入れる】jQuery Cycleを使ってシンプルなスライドを導入 今村だけがよくわかるブログ
http://www.imamura.biz/blog/cms/jimdo/3922

Webデザイナーへの道しるべ | suge1040's diary
Jimdoにスライドショーを入れる

http://suge1040.hatenablog.com/entry/2014/12/22/011243

#こんな場所でこんな記事を書くのもどうかと思いますが(^^;

ただし、この方法では、スライドショーに使う画像のサイズが大きいとき、スマートフォン表示を行ったときに横にはみ出てしまいます。そのため、横方向にもスクロールしてしまい参照しづらくなります。

jQuery Cycle の後継である Cycle2 (http://jquery.malsup.com/cycle2/) がレスポンシブ対応可能なので、これを利用してみます。

【1】ファイルのダウンロード

Cycle2 のページ内の Download をクリックします。
表示される Downloadページから、「Download Cycle2 Production Version」というボタンをクリックします。

Download_3

これで、jquery.cycle2.min.jsがダウンロードできます。

【2】googleのjsapiを使うためのコードを書く

Jimdoの管理画面右側の「設定」をクリックします。

Settei_3


「ヘッダー部分を編集」をクリックします。

Header_2


「ヘッダー部分の編集」ウィンドウが開きますので、以下のコードを書き込みます。

<script type="text/javascript" src="http://www.google.com/jsapi">
</script>
<script type="text/javascript">
//<![CDATA[
    google.load("jquery","1.7");
//]]>
</script>

Cycle2ではjQueryのバージョン1.7以降が必要なのでそのバージョンのところが変わっています。

Headeredit_2

【3】先ほどのダウンロードしたファイルを使う

引き続き、以下のコードを書きこみます。

<script type="text/javascript">
//<![CDATA[
jQuery.noConflict();
(function($) {
  $(function() {
ここに先ほどダウンロードしたjquery.cycle2.min.jsの内容をそのまま貼り付けます
  });
})(jQuery);
//]]>
</script>

【4】最後に、Cycle2を動かすための記述を追加

<style>
@media screen and (max-width: 870px) {
.cycle-slideshow { width: 100% }
.cycle-slideshow img { width: 100%; height: auto }
}
</style>

Cycle2を制御する方法は JavascriptではなくCSSになっています。

@media screen and (max-width: 870px) {
の行の 870px のところは、スライドショー画像の横サイズを指定します。
この部分で、スクリーンサイズが画像より小さい場合に、右にはみ出ないようにする(=100%表示)設定を行っています。

「ヘッダー部分を編集」への記入はここまでです。

【5】コンテンツの追加

Jimdoの「ウィジェット/HTML」ボックスを(以前は「文章」ボックスでもできていたのかもしれませんが)を追加して、以下のようにコードを書きます。

<div class="cycle-slideshow"
    data-cycle-fx="scrollHorz"
    >
    <img src="
http://malsup.github.io/images/p1.jpg">
    <img src="
http://malsup.github.io/images/p2.jpg">
    <img src="
http://malsup.github.io/images/p3.jpg">
    <img src="
http://malsup.github.io/images/p4.jpg">
</div>

divで指定するクラス名が cycle-slideshow に変わり、動作指定(水平スクロール、など)もこの中で指定することになります。

最後に、「保存」ボタンをクリックします。

Cycleslideshow_2


さぁてどうでしょう?うまくいったでしょうか?

| | コメント (2) | トラックバック (0)

2014年12月21日 (日)

東北のうまいもの(5)磐農なしジャムは、あり!

べたべたなダジャレで始まりましたが、実際に美味しいのであります。
福島県立磐城農業高等学校のなしジャム(梨48シリーズ)

48_2



3_2

どこかで聞いたような感じもしますが、いわき産梨「サンシャインいわき」を製品総重量の48%使用している本格的な製品なのであります。

果肉がとっても大きく、しゃくしゃくした歯ごたえとともに、梨の自然な甘みが口の中に広がります。

Jam_2

なしドレッシングをかけると、サラダがスイーツになります。

なしジャムほどの大きさではありませんが果肉が入っていて、ほどよい甘みと酸味のバランスが良いです。ブラックペッパーをほんの少しかけて引き締めるのもまた良し。…と思ったのは、びんをよく振っていなかったせいだというのが後でわかりました。

Dressing_2

焼き肉のたれは、辛味も抑え目で、たれ自身の主張が強すぎることがなく、かつ梨由来のほのかな甘みが、お肉の味を引き立ててくれます。

Yakinikutare_2

あえて難点?をいうならば…
果肉が大きいがために、あっという間に食べ終わってしまうこと!!
3回で完食であります!

Kannsyoku_2



ごちそうさまでした。また買いたいです。

 

 

高校生たちの活躍は、こちらから↓

磐農 研究班 - 梨48(@2014_bannou)さん  Twitter
https://twitter.com/2014_bannou

藤田志穂の「がちラジ!エンタ」ゆるそうで、ゆるくない!少しゆる~いラジオ! 「第46回 最多訪問!磐城農業高校…の巻」
http://www.fm-iwaki.co.jp/cgi-bin/WebObjects/1201dac04a1.woa/wa/read/1470abb71af/

東日本大震災風化防止 メモリースピーチプロジェクト (全国大会 金賞)
http://www.jen-npo.org/memory/index.php

| | コメント (0) | トラックバック (0)

2014年11月 3日 (月)

郵便局(ゆうちょ銀行)の通常払込は、対応ATMから休日でもできます

赤い色で印刷されている「払込取扱票」で払込が必要な場合がありますが、バーコードの類などが印刷されていないので、てっきり平日しか開いていない窓口でないと払込できないものかと思い込んでおりました。

実は土曜日・日曜日・休日でも、対応ATM(払込票専用の取り込み口があるもの)なら払込ができます。
(よく見ると裏面にちょろっと書いてあります)

ゆうちょ銀行の店舗・ATMのご案内の各店舗の【備考】のところに

払込用紙による通常払込み(ATM)・・・○

と記載があれば可能です。

ただし、土日休日は17時以降は現金での払込が出来ない(ゆうちょ銀行の口座のカードまたは通帳のみ可)というところもあるようです。

わたしはこれで1回出直しました。(´・ω・`)

| | コメント (0) | トラックバック (0)

2014年9月28日 (日)

東北のうまいもの(4)さんまでモンドセレクション金賞受賞

目黒のサンマイベントで購入させていただきました。
気仙沼は有限会社ケイさんの さんまつくだ煮

みそ味としょうゆ味を購入。

Sanmatukudani1

しょうゆ味は写真を撮る前に食べてしまいました、すみません。

濃すぎず甘すぎず、美味しくいただきました。

すごいのは材料の無添加っぷり。安心は味にも表れていると思います。

Sannmatukudani2

おばあちゃん頑張ってます!

| | コメント (0) | トラックバック (0)

東北のうまいもの(3)至高のごはんの友

山田町は 山田のおみごと

Omigoto_2




青じそごま味を最初に試食させていただいてハマりました。

あかもくという海藻の佃煮で、しゃきしゃきした食感、甘すぎず切れ味のいい味付けで、ご飯がすすみます。
おにぎりの具にも合いそうです。
お茶漬けなんかにもgood。
美容にもいいらしい?

手前はいわて銀河プラザで購入したものです。

| | コメント (0) | トラックバック (0)

東北のうまいもの(2)究極のごはんの友

大船渡は 三陸海の幸 シャイン さんの「あらびきさんま」

Arabikisanma

あったかいご飯にのっけて食べると、もうとまらない。がががーっとかっこんでしまいます。

骨までまとめて頂けて(食べていても骨が入っているとは気づかない)栄養的にも良い感じです。

三陸鉄道全線開通1週間前のイベントで購入させてもらって以来、何回か購入しています。

ネットでも購入できるようです。

| | コメント (0) | トラックバック (0)

東北のうまいもの(1)たこって、こんなに美味かった!

今日は、東北でハマった品をいくつか紹介します。

南三陸は伊里前マルアラ及川商店さんの「たこわさび」

Takowasabi_2




秋葉原のイベントで拝見したのですが、試食させてもらって…うんまっ!
やわらかくて、わさびの味付けが絶妙。

1000円以上する逸品ですが、ひとつだけでしたが購入させていただき、結局その日のうちに完食いたしました。

ごちそうさまでした。

Isatomae

| | コメント (0) | トラックバック (0)

«三陸に行きたい