タグ付けされた質問 「material-design」

現在、アプリをマテリアルデザインに変換する方法を学習中ですが、今は少し行き詰まっています。ツールバーを追加し、ナビゲーションドロワーにすべてのコンテンツをオーバーレイしました。私は現在、材料ガイドラインのような拡張可能な検索を作成しようとしています： これは私が今持っているものであり、上記のようにする方法を理解できません： これは私のメニューのxmlです。 <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <item android:id="@+id/action_search" android:icon="@android:drawable/ic_menu_search" android:title="Search" app:showAsAction="always" app:actionViewClass="android.support.v7.widget.SearchView" /> </menu> これで機能し、SearchViewに展開するメニュー項目が表示され、リストを細かくフィルター処理できます。１枚目の写真のようには見えませんが。ホームアイコンを戻る矢印に変更できるように を使用しようとしMenuItemCompat.setOnActionExpandListener()ましたがR.id.action_search、うまくいきません。リスナーでは何も発生しません。それがうまくいったとしても、それでも最初の画像にあまり近づきません。 マテリアルガイドラインのように見える新しいappcompatツールバーでSearchViewを作成するにはどうすればよいですか？

134 android  toolbar  android-appcompat  searchview  material-design 

Android Studioでテキストビューとイメージビューに波及効果を設定したい。どうすればできますか？

127 android  android-imageview  textview  material-design 

新しいをいじってandroid.support.design.widget.TabLayoutみたところ、クラス定義に問題があることがわかりました。インジケーターの色やデフォルトの高さを変更するメソッドはありません。 調査したところ、デフォルトのインジケーターの色はAppThemeから取得されたことがわかりました。具体的にはここから： <item name="colorAccent">#FF4081</item> さて、私の場合、を変更するとcolorAccent、この値を背景色として使用する他のすべてのビュー、たとえばProgressBarに影響します 今、indicatorColorをcolorAccent？以外の他のものに変更する方法はありますか？

124 android  material-design  android-design-library 

Listview内の私のCardviewがAndroid L（Nexus 5）で影を表示していません。また、丸いエッジは適切に表示されません。ListviewのAdapter Viewのコードは次のとおりです。 <?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:card_view="http://schemas.android.com/apk/res-auto" xmlns:app="http://schemas.android.com/apk/res/com.example.myapp" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" > <android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto" android:id="@+id/card_view" android:layout_width="match_parent" android:layout_height="wrap_content" app:cardBackgroundColor="@android:color/white" android:foreground="?android:attr/selectableItemBackground" app:cardCornerRadius="4dp" app:cardElevation="4dp" > <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingTop="@dimen/activity_vertical_margin" > <TextView android:id="@+id/tvName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_marginTop="@dimen/padding_small" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:textAppearance="?android:attr/textAppearanceLarge" /> <ImageView android:id="@+id/ivPicture" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/tvName" android:layout_centerHorizontal="true" android:scaleType="fitCenter" /> <TextView …

123 android  android-listview  android-5.0-lollipop  material-design  android-cardview 

Material-UIで少し遊んでいます。（Bootstrapのように）グリッドレイアウトを作成するためのオプションはありますか？ そうでない場合、この機能を追加する方法は何ですか？ GridListコンポーネントがありますが、それはいくつかの異なる目的を持っていると思います。

118 reactjs  material-design  material-ui  grid-system 

カスタムのBttomSheetDialogFragmentがあり、底面図の上部に丸い角を付けたい これは、下から表示したいレイアウトを膨らませるカスタムクラスです。 View mView; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { mView = inflater.inflate(R.layout.charge_layout, container, false); initChargeLayoutViews(); return mView; } また、このxmlリソースファイルを背景として持っています： <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <corners android:topRightRadius="35dp" android:topLeftRadius="35dp" /> <solid android:color="@color/white"/> <padding android:top="10dp" android:bottom="10dp" android:right="16dp" android:left="16dp"/> しかし、問題は、このリソースファイルをレイアウトのルート要素の背景として設定しても、角がまだ丸くないことです。 そして私は以下のコードを使用することはできません： this.getDialog().getWindow().setBackgroundDrawableResource(R.drawable.charge_layout_background); BottomSheetDialogのデフォルトの背景をオーバーライドすると、底面ビューの上に半透明の灰色が表示されなくなります。

114 android  material-design  bottom-sheet  material-components-android  material-components 

バックグラウンド 私は、Googleマップが検索結果のボトムシートを表示する方法と同様に動作するUIを作成するよう割り当てられています。 3つの異なるフェーズがあります。 下部のコンテンツ。上部はまだタッチ可能で、下部では何もスクロールしません 全画面コンテンツ。上部領域には大きなヘッダーがあります。 全画面コンテンツ。上部領域にはツールバーのみがあります。 これがGoogleマップで話していることです。 問題 実は、一番下のシートはまだデザインライブラリの一部ではありません（要求されましたが、ここ）。 それだけでなく、UIはかなり複雑に見え、複数のフェーズでツールバーを処理する必要があります。 私が試したこと 私は（下のシートのための良好な（十分な）ライブラリ見つけたここに）、および（のような材料設計サンプルに示すように、同じビューについて持っているために、その断片試料にコンテンツを追加こちら）世話をするCollapsingToolbarLayoutを持っています、フェーズ2 + 3の。 私が作成しているアプリでは、スクロールするときにアイコンも移動する必要がありますが、残りの部分で成功した場合、これは簡単なはずです。これがコードです： fragment_my.xml <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout android:id="@+id/main_content" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="@dimen/detail_backdrop_height" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/collapsing_toolbar" android:layout_width="match_parent" android:layout_height="match_parent" app:contentScrim="?attr/colorPrimary" app:expandedTitleMarginEnd="64dp" app:expandedTitleMarginStart="48dp" app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"> <ImageView android:id="@+id/backdrop" android:layout_width="match_parent" android:layout_height="match_parent" android:scaleType="centerCrop" app:layout_collapseMode="parallax"/> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:layout_collapseMode="pin" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/> …

110 android  material-design  android-coordinatorlayout  android-design-library  android-collapsingtoolbarlayout 

AppBarフラッターの高さを簡単に設定するにはどうすればよいですか？ バーのタイトルは、垂直方向の中央に配置する必要があります（その中でAppBar）。

110 dart  material-design  flutter 

私はいくつかのSOの質問を見てきました、そして彼らは私が望むものを達成するためにいくつかの可能な方法を与えました。例えば： colorControlHighlightstyles.xmlで属性を使用します。 これが私のstyles-v21.xmlです： <style name="SelectableItemBackground"> <item name="android:colorControlHighlight">#5677FC</item> <item name="android:background">?attr/selectableItemBackground</item> </style> そして私のウィジェット： <TextView android:id="@+id/tv_take_photo_as_bt" android:layout_width="280dp" android:layout_height="48dp" android:text="@string/act_take_photo" style="@style/SelectableItemBackground"/> そして、それは機能しません。parent="Theme.AppCompat「SelectableItemBackground」スタイルに追加したり、に変更しcolorControlHighlight(no android: prefix)"たり、に変更したりしましたが?android:attr/selectableItemBackground、どちらも役に立ちません。 backgroundTintレイアウトで属性を使用します。 だから私は私のに追加android:backgroundTint="#5677FC"しますTextView。まだ役に立たない。それから私は、変更しようとandroid:backgroundTintModeするsrc_inとsrc_atop、彼らは違いを作ることはありません。 それで、?attr/selectableItemBackground背景として使用する場合、リップルカラーをどのように変更できますか？私はロリポップ以上にのみ焦点を当てています。前もって感謝します！

103 android  android-layout  android-5.0-lollipop  material-design  android-appcompat 

これが機能していないので、私はマテリアルのアイコンをどのように使用するのか疑問に思っていました： <material-icon icon = "/img/icons/ic_access_time_24px.svg"> </material-icon> icon属性のパラメーターとして指定されたパスに問題があると思います。このアイコンフォルダが実際にどこにあるのか知りたいのですが。

102 angularjs  material-design  angularjs-material 

alertDialogのポジティブクリック内のDialogFragmentにスナックバーを表示しています。これが私のコードスニペットです。 Snackbar snackbar = Snackbar.make(view, "Please enter customer name", Snackbar.LENGTH_LONG) .setAction("Action", null); View sbView = snackbar.getView(); sbView.setBackgroundColor(Color.BLACK); snackbar.show(); ダイアログフラグメントのビューをスナックバーに渡します。背景色を黒にしたいですか？これどうやってするの？DialogFragmentでalertDialogを返しています。そして、私がダイアログに設定しているテーマは次のとおりです <style name="MyAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert"> <!-- Used for the buttons --> <item name="colorAccent">@color/accent</item> <!-- Used for the title and text --> <item name="android:textColorPrimary">@color/primary</item> <!-- Used for the background --> <item name="android:background">@color/white</item> </style> ダイアログの背景色を白に設定していますが、背景色をスナックバーに設定することで上書きする必要があります。

101 android  material-design  android-dialogfragment  android-snackbar 

マテリアルデザインでイオンを使用したい。カスタムCSSと角度材料でイオンディレクティブを使用するのに悩まされています イオン指令を使用すると、次のような多くの効率的な機能が得られることを読みました アプリデータは、他のビューに移動してページに戻った後でも、UIルーターで記憶されます イオンリストアイテムは、表示の高さまでのみレンダリングされ、下または上にスクロールしたときに再利用されます パフォーマンスが大幅に改善されました。 しかし、イオン指令を使用する場合、それらには材料設計がありません。 アンギュラマテリアルを使用する場合、これらのパフォーマンスの向上、およびモバイルアプリケーションに必要な追加機能はありません。 Angular-materialディレクティブは <md-list> <md-item ng-repeat="item in items"> Hello, {{item}}! </md-item> </md-list> イオン指令は <ion-list> <ion-item ng-repeat="item in items"> Hello, {{item}}! </ion-item> </ion-list> Ionicが角材料プロジェクトの開発に資金を提供しているように見えますが、なぜ角材料はイオンとの使用に互換性がないのですか？ イオンの性能向上と機能を失うことなく、角度材料コンポーネントをどのように使用できますか？ または イオンで材料設計を使用するためのより良いアイデアはありますか？

98 javascript  angularjs  ionic-framework  ionic2  material-design 

プロジェクトで新しいDesign TabLayoutを使用しようとしています。レイアウトをすべての画面サイズと向きに適合させたいのですが、1つの向きで正しく表示できます。 私は重力とモードを扱い、私のtabLayoutを次のように設定しています： tabLayout.setTabGravity(TabLayout.GRAVITY_CENTER); tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE); そのため、スペースがない場合はtabLayoutはスクロール可能ですが、スペースがある場合は中央に配置されます。 ガイドから： public static final int GRAVITY_CENTER TabLayoutの中央にタブをレイアウトするために使用される重力。 public static final int GRAVITY_FILL重力は、TabLayoutを可能な限り埋めるために使用されます。このオプションは、MODE_FIXEDと共に使用した場合にのみ有効になります。 public static final int MODE_FIXED固定タブはすべてのタブを同時に表示し、タブ間の迅速なピボットの恩恵を受けるコンテンツで使用するのに最適です。タブの最大数は、ビューの幅によって制限されます。固定タブの幅は、最も広いタブラベルに基づいて同じです。 public static final int MODE_SCROLLABLEスクロール可能なタブは、いつでもタブのサブセットを表示し、より長いタブラベルと多数のタブを含めることができます。これらは、ユーザーがタブラベルを直接比較する必要がないタッチインターフェイスのコンテキストを閲覧するのに最適です。 したがって、GRAVITY_FILLはMODE_FIXEDとのみ互換性がありますが、atはGRAVITY_CENTERに対して何も指定していません。MODE_SCROLLABLEと互換性があると思いますが、これはGRAVITY_CENTERおよびMODE_SCROLLABLEを使用して取得するものです。 したがって、両方の方向でSCROLLABLEを使用していますが、GRAVITY_CENTERは使用していません。 これは私が風景に期待することです。しかし、これを行うには、MODE_FIXEDを設定する必要があるため、ポートレートで取得できるのは次のとおりです。 tabLayoutが画面に収まる場合、GRAVITY_CENTERがSCROLLABLEに対して機能しないのはなぜですか？重力とモードを動的に設定する（そして私が期待していることを確認する）方法はありますか？ どうもありがとうございました！ 編集：これは私のTabLayoutのレイアウトです： <android.support.design.widget.TabLayout android:id="@+id/sliding_tabs" android:layout_width="match_parent" android:background="@color/orange_pager" android:layout_height="wrap_content" />

98 android  android-5.0-lollipop  material-design  gravity 

のSnackbar (android.support.design.widget.Snackbar)ように、アクティビティの開始時にAndroid を表示しToastます。 しかし問題は、次のSnackbarように作成するときに親レイアウトを指定する必要があることです。 Snackbar.make(parentlayout, "This is main activity", Snackbar.LENGTH_LONG) .setAction("CLOSE", new View.OnClickListener() { @Override public void onClick(View view) { } }) .setActionTextColor(getResources().getColor(android.R.color.holo_red_light )) .show(); Snackbarアクティビティの開始時にクリックイベントなしで表示するときに親レイアウトを指定する方法（クリックイベントの場合、親ビューを簡単に渡すことができます）？

98 android  material-design  android-snackbar 

アプリ全体で自社のブランドカラーを使いたい。 私はこの問題を発見しました：AngularJS 2-マテリアルデザイン- 申し立てによるとカスタムテーマを構築できるカラーパレットを設定します。Material2の定義済みカラーを使用したくありません。ユニークで特別なブランドカラーが欲しいです。自分でテーマを作成するより良い方法（正しい？）はあり_palette.scssませんか？ ブランドパレットのミックスインを作成する必要がありますか？もしそうなら-それを適切に行う方法のガイドはありますか？さまざまな色合いの意味は何ですか（50、100、200、A100、A200などの番号が付いています）？ このエリアに関する情報は大歓迎です！

98 angular  sass  material-design  angular-material2