I'm trying to follow this documentation on shape theming and I'm hitting a wall.
here is my styles.xml file:
<resources>
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
<item name="android:windowNoTitle">true</item>
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorPrimaryDark">#color/primary</item>
<item name="android:colorAccent">#color/blue</item>
<item name="android:colorControlNormal">#color/very_light_gray</item>
<item name="android:colorControlActivated">#color/light_gray</item>
<item name="android:colorButtonNormal">#color/button_background</item>
<item name="android:textColorSecondary">#color/gray</item>
<item name="android:textColorPrimary">#color/primary_text</item>
<item name="android:navigationBarColor">#color/primary</item>
<item name="shapeAppearanceSmallComponent">#style/ShapeAppearance.SmallComponent</item>
<item name="shapeAppearanceMediumComponent">#style/ShapeAppearance.MediumComponent</item>
<item name="shapeAppearanceLargeComponent">#style/ShapeAppearance.LargeComponent</item>
</style>
<style name="ShapeAppearance.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
<item name="cornerFamily">cut</item>
<item name="cornerSize">4dp</item>
</style>
<style name="ShapeAppearance.MediumComponent" parent="ShapeAppearance.MaterialComponents.MediumComponent">
<item name="cornerFamily">cut</item>
<item name="cornerSize">8dp</item>
</style>
<style name="ShapeAppearance.LargeComponent" parent="ShapeAppearance.MaterialComponents.LargeComponent">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">4dp</item>
</style>
</resources>
When I go and build my app I get a list of errors:
Here's the packages I have installed:
I'm not sure if I'm missing a package or if Xamarin.Android has yet to support this. I know there are other ways to do this but I'd prefer to do it this way if I can.
Try to update Xamarin.Google.Android.Material nuget to the latest version,and install Xamarin.AndroidX.Legacy.Support.Core.UI nuget,it works for me.
Related
I change the manifest file to use the following theme:
change from:
#style/AppTheme
to
#style/Theme.Material.Light
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:versionCode="1" android:versionName="1.0" package="App1.App1" android:installLocation="preferExternal">
<uses-sdk android:minSdkVersion="23" android:targetSdkVersion="27" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<application android:allowBackup="true" android:icon="#mipmap/ic_launcher" android:label="#string/app_name" android:roundIcon="#mipmap/ic_launcher_round" android:supportsRtl="true" **android:theme="#style/Theme.Material.Light"></application>
</manifest>
But when building and deploying got the following error:
Sdkminversion is as follows it is above 21.
uses-sdk android:minSdkVersion="23"
i have managed to make it able to compile using Theme.Holo.Light
however,the theme is still black in color by clearing the content in the following folder:
C:\Users\your_name\AppData\Local\Xamarin
Theme.Holo.Light is supposed to be white in colour background ,right?
Any idea what is wrong?
You should define Theme.Material.Light in your /Resource/values/style.xml.
<style name="MyMaterialTheme" parent="Theme.Material.Light">
<item name="windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="colorPrimary">#1286d9</item>
<item name="colorPrimaryDark">#1286d9</item>
</style>
& than use it like this #style/MyMaterialTheme. You should use color and other features according to your preference.
😊
I would like to remove the purple gap in my preference screen:
preference
so that it should look like this:
Google Play Store example
I'm using Xamarin Android and c# to develop my app.
The preference screen is an PreferenceFragmentCompat from Android.Support.V7.Preferences library. The material style is set in my custom theme:
<style name="Theme.DarkTheme" parent="Theme.AppCompat.NoActionBar">
<item name="colorPrimary">#673AB7</item>
<item name="colorPrimaryDark">#512DA8</item>
<item name="colorAccent">#039be5</item><!--#FF4081-->
<item name="colorControlHighlight">#242424</item>
<item name="android:listDivider">#style/android:drawable/divider_horizontal_dim_dark</item>
<item name="preferenceTheme">#style/PreferenceThemeOverlay.v14.Material</item>
Here is how my xml resource file looks like, which I call by AddPreferencesFromResource(Resources.Id.preference_screen) in my PreferenceFragmentCompats OnCreatePreferences() function:
<android.support.v7.preference.PreferenceScreen
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.v7.preference.PreferenceCategory
android:title="App">
<Preference
android:key="advsettings_preference"
android:title="Erweiterte Einstellungen" />
<Preference
android:key="license_preference"
android:title="Rechtliche Hinweise" />
</android.support.v7.preference.PreferenceCategory>
</android.support.v7.preference.PreferenceScreen>
I already tried to fix it myself by adding padding attributes to PreferenceScreen, but nothing changed.
All the latest NuGet Packages from Xamarin Android are installed (v27.0.2).
Thanks in advance.
Please try set the style like this;
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
...
<!-- Customize your theme here. -->
<item name="preferenceTheme">#style/MyPreferenceStyle</item>
</style>
<style name="MyPreferenceStyle" parent="#style/PreferenceThemeOverlay.v14.Material">
<item name="preferenceCategoryStyle">#style/MyPreferenceCategoryStyle</item>
<item name="android:paddingLeft">10dp</item>
<item name="android:paddingRight">10dp</item>
</style>
<style name="MyPreferenceCategoryStyle" parent="#style/Preference.Category.Material">
<item name="android:layout">#layout/preference_category</item>
</style>
And preference_category.axml:
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+android:id/title"
android:textColor="?android:attr/colorAccent"
android:textSize="14dp"
android:fontFamily="sans-serif-medium"
android:paddingStart="16dp"
android:singleLine="true"
android:paddingTop="16dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
And AppSettings:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.preference.PreferenceScreen
xmlns:android="http://schemas.android.com/apk/res/android">
<android.support.v7.preference.PreferenceCategory
android:title="App">
<Preference
android:key="advsettings_preference"
android:title="Erweiterte Einstellungen"
android:summary="BenachRichtigung"/>
</android.support.v7.preference.PreferenceCategory>
</android.support.v7.preference.PreferenceScreen>
It will resolve the gap issue. And also look similar to your screenshot of Google Play Store. Well, not exactly the same from the Layout Inspector, but similar:
The purple area when looking at your layout with "use layout bounds" in the developer options enabled represent margins, not padding as far as I know.
I suggest trying to make a custom layout for your PreferenceCategory and your Preference's and setting them in your above axml using the android:layout attribute as such:
android:layout="#layout/layout_name"
(Might need to play around with both android:layout and android:widgetLayout attributes)
I am getting Binary XML file line #1: Binary XML file line #1: Error inflating class error occure for AppCompat error while trying to add tabbar and toolbar in android.Can anybody help me to come out of it.refering this link AppCompact
Here is my code. This is Style`
<?xml version="1.0" encoding="UTF-8"?>
<resources>
<style name="MyTheme" parent="MyTheme.Base">
</style>
<style name="MyTheme.Splash" parent ="Theme.AppCompat.Light">
<item name="android:windowBackground">#drawable/Splash</item>
<item name="android:windowNoTitle">true</item>
</style>
<style name="MyTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primaryDark</item>
<item name="colorAccent">#color/accent</item>
<item name="android:windowBackground">#color/window_background</item>
<item name="windowActionModeOverlay">true</item>
</style>
<style name="AppCompatDialogStyle" parent="Theme.AppCompat.Light.Dialog">
<item name="colorAccent">#FF4081</item>
</style>
</resources>
This is code in Tabbar.axml and toolbar.axml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.TabLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:tabIndicatorColor="#android:color/white"
app:tabGravity="fill"
app:tabMode="fixed" />
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
and main activity
public class FormsActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity//FormsApplicationActivity//
{ protected override void OnCreate (Bundle savedInstanceState)
{
FormsAppCompatActivity.ToolbarResource = Resource.Layout.Toolbar;
FormsAppCompatActivity.TabLayoutResource = Resource.Layout.Tabbar;
base.OnCreate (savedInstanceState);}
`
Try to uninstall the Xamarin.Forms, do a full clean, delete bin/obj folder, restart VS, install back the Xamarin.Forms, rebuild whole solution.
Is there a way to reuse styles in an iOS app as it's done in android?
(or other approach, css-like, for example)
Like this:
styles.xml
<style name="SplashTheme" parent="#style/Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#android:color/black</item>
</style>
<!-- Base application theme. -->
<style name="AppTheme" parent="#style/Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#color/AppBackground</item>
</style>
<!-- Search Bar -->
<style name="AppTheme.SearchBar" parent="AppTheme">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">#dimen/searchBarSize</item>
<item name="android:background">#drawable/search_bar_background</item>
<item name="android:layout_alignParentTop">true</item>
<item name="android:layout_alignParentLeft">true</item>
</style>
//...
activity.xml
<LinearLayout
android:layout_below="#id/searchBar"
style="#style/AppTheme.Table"
>
//...
</LinearLayout>
There are several libraries which you should take a look at including Freestyle (http://www.freestyle.org), UISS (https://github.com/robertwijas/UISS), NUI (https://github.com/tombenner/nui) and MAThemeKit (https://github.com/mamaral/MAThemeKit).
Also check out the documentation for UIAppearance.
Short answer: no.
Long answer: You will either need to manually set the styles on each view, OR you could extend the components (or create your own subclasses) which implements the styles you want.
I am trying to open an external link from my menu-config.xml submenu..Is this possible to do ?
It is not working for me
<Menu name="MainMenu" title="MainMenu" description="MainMenu">
<Item name="Google" title="Google" description="Google" link="http://www.google.com" ></Item>
<Item name="Google" title="Google" description="Google" link="http://www.google.com" ></Item>
</Menu>
I tried using location and like this
menu name="google" link="javascript:window.open('http://www.google.com/');"
Thanks