質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

Visual Studio

Microsoft Visual StudioはMicrosoftによる統合開発環境(IDE)です。多種多様なプログラミング言語に対応しています。

XAML

XAML(Extensible Application Markup Language)はWPF、Silverlight、Windows PhoneそしてWindows Store appsでユーザーインターフェースを定義するために使われるXML言語です。

teratail

teratail(テラテイル)は、プログラミングに特化した日本語Q&Aサイトです。

Visual Studio 2013

Microsoft Visual Studio 2013は、Microsoftによる統合開発環境(IDE)であり、多種多様なプログラミング言語に対応しています。 Visual Studio 2012の次のバージョンです

Q&A

解決済

1回答

26206閲覧

borderに影を付けてボタンっぽくしたい。

b1ackc0ffee

総合スコア267

C#

C#はマルチパラダイムプログラミング言語の1つで、命令形・宣言型・関数型・ジェネリック型・コンポーネント指向・オブジェクティブ指向のプログラミング開発すべてに対応しています。

Visual Studio

Microsoft Visual StudioはMicrosoftによる統合開発環境(IDE)です。多種多様なプログラミング言語に対応しています。

XAML

XAML(Extensible Application Markup Language)はWPF、Silverlight、Windows PhoneそしてWindows Store appsでユーザーインターフェースを定義するために使われるXML言語です。

teratail

teratail(テラテイル)は、プログラミングに特化した日本語Q&Aサイトです。

Visual Studio 2013

Microsoft Visual Studio 2013は、Microsoftによる統合開発環境(IDE)であり、多種多様なプログラミング言語に対応しています。 Visual Studio 2012の次のバージョンです

0グッド

0クリップ

投稿2015/08/25 06:42

編集2015/08/26 01:15

visualstudioを使い始めて2週間です。
イメージ説明
Borderを使って、画像のようについつい押したくなるようなボタンをつくりたいです。

現在のデザインは、
グレーで作ったImageのうえに、少し小さくして角を丸めたBorderを重ねて、
影があるように見せています。

[開発環境]
visualstudio2015 ・・・teratailにはタグがないの?
C# xaml .net

htmlやイラレのように、shadowを設定することはできないのでしょうか?

これもいけそう

Borderコントロールを使った画像の表示では、次の画面のように、角丸画像に簡易的に影を付けることもできる。これは、Borderコントロールの右辺と下辺の境界線のみをグレーで描くことによって実現している。BorderThickness属性でカンマ区切りにより4つの値を記述した場合には、(左から)左辺、上辺、右辺、下辺の境界線の太さの指定となる。

あとこれもいけそうやけど、xamlでなく.cs?

// 影付きを設定します。
this.TextBox1.Border.Shadow = true;

以上、
宜しくお願い致します。

------------------------------追加------------------------------

xaml

1<Page.Resources> 2 <Style x:Key="BorderStyle" TargetType="Border"> 3 <Setter Property="Background" Value="White"/> 4 <Setter Property="Width" Value="580"/> 5 <Setter Property="Height" Value="169"/> 6 </Style> 7</Page.Resources> 8 9 10<Border Style="{StaticResource BorderStyle}"> 11 <Grid> 12 <Grid.ColumnDefinitions> 13 <ColumnDefinition Width="Auto"/> 14 <ColumnDefinition Width="*"/> 15 <ColumnDefinition Width="Auto"/> 16 </Grid.ColumnDefinitions> 17 <TextBlock Text="ボタン" Style="{StaticResource TextBlockStyle}"/> 18 </Grid> 19</Border>

イメージ説明

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

こんにちは。

XAMLということでWPFなのかストアアプリなのか明記されておりませんが、
WPFという前提でひとまず回答しちゃいます。(ストアアプリで使えるか未検証)

簡単な方法としては、DropSharowEffectを使えば影を付与できます。

XAML

1<Window x:Class="WpfApplication3.MainWindow" 2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 4 Title="MainWindow" Height="350" Width="525"> 5 <Grid> 6 <Button Content="PRESS ME, I'M A BUTTON" Width="200" Height="50" > 7 <Button.Effect> 8 <DropShadowEffect BlurRadius="4" RenderingBias="Quality" ShadowDepth="10"/> 9 </Button.Effect> 10 </Button> 11 </Grid> 12</Window>

https://msdn.microsoft.com/ja-jp/library/ms748273(v=VS.110).aspx

もちろん、b1ackc0ffeeさんが調査済みのようにエレメントを重ねて影を表現するケースも多々あると思います。
ご参考までに。

投稿2015/08/25 07:04

Tak1wa

総合スコア4791

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

b1ackc0ffee

2015/08/26 01:19

お世話になります、回答有難うございます。 Blend2015を使っています。 WPFとストアアプリの違いがわかっておらずすみません。 ストアアプリ、空のページで行っていますが、違いがありますでしょうか? DropSharowEffectをプロパティの中で見つけることができませんでした。 説明不足で済みません。 テキストにではなく、テキストを囲んでいるBorderに影を付けたいです。 なお、buttonは使用せず、Boderだけで書きたいです。 宜しくお願い致します。 画像とコードを追加しました。 宜しくお願い致します。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問