UI
Xamarin.Formsのコントロールには拡大･縮小,回転,フェードイン･アウトなど基本的なアニメーションのためのメソッドが用意されています. もちろん,Scale,Rotation,Opacityなどのプロパティの値を直接操作することもできます. shuhelohelo.hatenablog.com さて…
ShellやNavigationのナビゲーションバーを直接動かすことはできないので,Frameコントロールでナビゲーションバーにあたるものを配置して,ということです. さて,モバイルアプリは上下にスクロールして使うUIが多いです. 上部にナビゲーションバーがあって,そ…
各ページのContentPage要素の属性にNavigationPage.HasNavigationBar="False"を追加する.
追記(2020/04/12 各プロジェクトにフラグをセットする必要はなく,App.xaml.csのコンストラクタに以下のように記述すればOkになりました. public App() { InitializeComponent(); Xamarin.Forms.Device.SetFlags(new List<string>() { "StateTriggers_Experimental", </string>…
Shellを使う準備については以下の記事を参照. shuhelohelo.hatenablog.com 上の記事とかぶる内容もある. 環境 Xamarin.Forms 4.5 アップデートによって使える機能,設定が異なるので注意. 例えばShellのPresentationMode属性はXamarin.Forms 4.3にはなかった…
Xamrin.Formsの画面遷移にはページ遷移とモーダルページの表示がある. ページ遷移 ページ遷移は以下のように記述する. private async void Button_Clicked_1(object sender, EventArgs e) { await Navigation.PushAsync(new SecondPage()); } ページ遷移のア…
例1:ライブラリ無しでピュアなXamarin.Formsで実現する 以下の例ではライブラリを使用せずに,PCLで,XamlとC#で,ドノーマルのXamarin.Formsでカスタムダイアログ,カスタムメッセージボックスを表示させている. winstongubantes.blogspot.com 手法としては,ダ…
VisualStateManager docs.microsoft.com Visual State Manager(VSM)はコントロールの見た目を予め数種類定義しておき,それを切り替えることができるようにする機能です. VSMにはデフォルトの定義があり,それはCommonStatesというグループ名で定義されている.…
Syncfusionはアプリケーションのための様々なコンポーネントを提供している企業です. .NETだけでなくJavaScriptやflutter,Vue,Reactなど多くのプラットフォームのコントロールを取り揃えています. おしゃれなコントロールを作ることはデザイン的にも実装技術…
docs.microsoft.com CollectionViewであればDataTemplate直下のコンテナ要素の背景色をVisual State Managerで切り替えることで,アイテム選択時の背景色を変更できる. これは素晴らしい!プラットフォームごとに実装する必要がない.とても簡単. Styleのターゲ…
shuhelohelo.hatenablog.com 上の記事のようにXamarin.Forms v4.3とv4.4以上ではFrameやGridといった領域の中のコントロールは,その領域の外側にははみ出さないように描画される,ようだ. とはいえ,コントロールの位置をずらして縁に重ねたりするのはおしゃれ…
Layoutに表示する項目(アイテム)のUIを統一したい場合に使います. Using Bindable Layouts with Xamarin.Forms Controls | Syncfusion Blogs ListViewでListItemに対してUIのテンプレートを適用して,全てのItemを同じ見た目にする,というのはよくやります. L…
shuhelohelo.hatenablog.com 上の記事で書いたようにXamarin.FormsのCollectionViewはListViewよりも機能が豊富かつ柔軟な表現ができます. アイテムを一つ一つ強制的に止めるSnapの機能がありますが,これを使えば漫画アプリビューワのように1ページずつめく…
環境 Xamarin.Forms 4.4 preview2 遅延ローディングが簡単にできる! などなど。 こりゃすごい. https://devblogs.microsoft.com/xamarin/5-quick-tips-for-collectionview/ CollectionView, CarouselViewなどXamarin.FormsのUIコントロールの便利な機能を紹…
コントロールのサイズを縦,横それぞれにピクセルの値を指定するのではなく,縦を決めれば自動的に横が縦の2分の1のサイズになるようにしたい,と思いました.例えばです. 名刺と同じ縦横比のカード風コントロールを作成するとします. 日本の名刺の一般的なサイ…
カスタムレンダラーから変更する方法がよくわからなかった. stackoverflow.com ↑の記事によると,カスタムレンダラに追加すれば良いとのこと. IntPtr IntPtrtextViewClass = JNIEnv.FindClass(typeof(TextView)); IntPtr mCursorDrawableResProperty = JNIEnv…
Entryコントロールのカーソルの色を変えたいのだけれど,その途中で見つけたEntryコントロールの下線部の色を変更する方法. kotaeta.com カスタムレンダラーで変更する.Custom Renerer Android. [assembly: ExportRenderer(typeof(Entry), typeof(MyEntryRend…
shuhelohelo.hatenablog.com 前回の続き. 今回はリスト表示のページ. 元 極めてダサい. ボタンに影をつけてハイライトカラーをつけた リストアイテムを影付きフレームにした ださいな... 飾りのハイライトカラーをつけた フォントサイズも変えた. アイコンを…
これは座標を指定するとそこまでの方角と距離を表示する自作アプリです. このUIを少しでも今風にしたいと思います. ダークモードのことなど考えず,白を貴重に角を若干丸くしたカード風UIを多様していけば自ずとおしゃれになるのではないかと甘く考えています…
https://xamgirl.com/awesome-xamarin-forms-properties-that-you-probably-didnt-know-about/ カスタムレンダラーを作るなど各プラットフォームのコードを編集することなくできる,実はこんなこともできる,という内容のTips集. ボタンに影をつける iPadのモ…
こちらの記事がまさにピッタリのものだった.素晴らしい.ありがとうございます. alexdunn.org 現時点ではこれがベストかな. カスタムレンダラーを使う. Frameを継承したShadowFrameクラスを作る. Elevationプロパティを追加する.バインディング可能にしておい…
アイコンフォントとは アイコンのWebフォントです.フォントなのでテキストと同じようにサイズや色を変えることができます. (雑) 上記のサイトを参考にしてアイコンフォントをXamarin.Formsで使えるようにします. フォントの入手 以下のサイトからアイコンフ…
fontello.com FontelloではFont Awesomeをはじめとしていくつかの種類のフォントをダウンロードできる. とても便利.
qiita.com forums.xamarin.com こちらの動画の中のデモアプリケーションでもShellのドロワーっていうのかな,左から出てくるメニューの背景でグラデーションが使われている. www.youtube.com 背景にグラデーションをつけるにはカスタムレンダラーを使う必要が…
xamarin forms uppercase text problemridablogging.wordpress.com AndroidアプリのButtonはデフォルトでは例えTextプロパティに小文字で設定したとしても,大文字で表示されます. これを設定したとおりに表示したい場合,以下の設定が必要です. まず,And…
既存のアプリのUIを模写するのはとても良い勉強になります. 今回はListViewの練習としてAndroidのTwitterアプリのフォローリストを模写してみたいと思います. 目標 Twitterアプリのフォロー中のリストを表示するとこういったリストが表示されると思います. …
github.com 吹き出しコントロールはFrame(吹き出し本体部分)とSkiaSharp(吹き出しの口部分)の組み合わせで作ることができる. Gridの中にSkiaSharpのキャンバスとFrameを重ね合わせて置くことで,吹き出しの見た目を作っている. これをカスタムコントロールと…
forums.xamarin.com LabelなどのFontSizeは数字でもLarge,SmallなどのNamedSize列挙体の値でもどちらでも大丈夫です. ではそれをカスタムコントロールのプロパティでNamedSize列挙体を使うためにはどうしたらいいのか. 以下のようにする. //https://github.c…
docs.microsoft.com 例えば以下のように,ListView(CollectionView,CarouselViewなど)にバインディングするListとその他のプロパティがあるとします. public partial class MainPage : ContentPage { public int ImageWidth { get; set; } public int ImageHe…
