Quantcast
Channel: かずきのBlog@hatena
Viewing all articles
Browse latest Browse all 1387

UWPのPivotで左右の余白を0にする

$
0
0

Pivotコントロールを使うと、コンテンツを表示するところの左右に余白が作られてしまいます。 こいつを消したい!というときにどうするかというと…

方法1

PivotItemのMarginを0に設定する。

PivotItemの数が固定で、自分PivotItemを置いてるだけならこれがお手軽です。

<Pivot><PivotItem Margin="0" ...>
    ...
  </PivotItem></Pivot>

方法2

PivotのItemContainerStyleでPivotItemのStyleを指定してMarginを消す。

これもお手軽です。というか、方法1よりも正攻法っぽい。

<Pivot><Pivot.ItemContainerStyle><Style TargetType="PivotItem"><Setter Property="Margin"Value="0" /></Style></Pivot.ItemContainerStyle><PivotItem Header="Item1"><Border Background="Red" /></PivotItem><PivotItem Header="Item2"><Border Background="Red" /></PivotItem><PivotItem Header="Item3"><Border Background="Red" /></PivotItem></Pivot>

方法3

PivotItemのデフォルトのマージンを置き換える。

PivotItemのMarginはgeneric.xamlにThemeResourceでPivotItemMarginという値で12,0という感じで定義されています。これを上書きしてやる方法です。

App.xamlに以下のように定義してやることで、アプリで使うすべてのPivotの余白を消します。

<Applicationx:Class="App25.App"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="using:App25"RequestedTheme="Light"><Application.Resources><ResourceDictionary><ResourceDictionary.ThemeDictionaries><ResourceDictionary x:Key="Default"><Thickness x:Key="PivotItemMargin">0</Thickness></ResourceDictionary></ResourceDictionary.ThemeDictionaries></ResourceDictionary></Application.Resources></Application>

まとめ

基本、方法2かな?PivotのStyleを定義しておいて、そこでItemContainerStyleを指定しておく感じ。そして、余白消したいPivotのStyleに、定義しておいたStyleを適用すればよさそうです。

アプリ全体の方針としてPivotの余白消えていいよっていうなら方法3あたりでもいいかも。


Viewing all articles
Browse latest Browse all 1387

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>