Android circular imageview with two borders CROPPED - c#

I'm attempting to make a circular imageView with two borders.
The circular image is made with a library that only allows to make one border, with the app:civ_border_color property.
The second border is achieved by setting a background property.
My problem is, the second border, made with the background, is being cropped on the sides, like this:
The circular image
<de.hdodenhof.circleimageview.CircleImageView xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/profile_image"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:background="#drawable/border"
android:padding="0dp"
android:layout_margin="0dp"
android:layout_height="200dp"
android:src="#drawable/mrwhite"
app:civ_border_width="3dp"
app:civ_border_color="#BF0404" />
The second border
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadius="0dp"
android:shape="ring"
android:thicknessRatio="1.9"
android:useLevel="false" >
<solid android:color="#android:color/transparent" />
<stroke
android:width="5dp"
android:color="#F2F2F2" />
</shape>

Change thicknessRatio value to 2
android:thicknessRatio="2"

A simple way to create RoundedImageView using ImageView and CardView
Check this example: https://github.com/SergeySharipov/RoundedImageView
Add the following dependency to your app module's build.gradle file:
dependencies {
implementation 'com.android.support:cardview-v7:27.1.0'
}
Add the code to your layout and change "YOUR_PICTURE":
<android.support.v7.widget.CardView
android:id="#+id/card_view_for_image"
android:foreground="#drawable/shape"
android:layout_margin="2dp"
android:layout_width="200dp"
android:layout_height="200dp"
app:cardCornerRadius="100dp">
<ImageView
android:id="#+id/rounded_image_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/YOUR_PICTURE" />
</android.support.v7.widget.CardView>
Create shape.xml in drawable and add this:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<stroke
android:width="10dp"
android:color="#f44336" />
</shape>
</item>
<item>
<shape android:shape="oval">
<stroke
android:width="5dp"
android:color="#ffffff" />
</shape>
</item>
</layer-list>

Related

Unknown Error in Layouts Converting from Android to Xamarin

EDIT: TLTR; This was a long and hard road. Turns out Visual Studio / Xamarin / Android / SOMETHING.. didn't like that I moved the downloaded .xml files into my drawable folder, and just renamed them to .axml so creating new .axml files and pasting the .xml layouts into there seems to have fixed it all.
.....
I think I have an issue in my layouts. The project won't build, but no errors are shown.
What I have noticed is that.. if I delete three blocks of code references my axml and layout ids, the project builds (see comments in first code section below).. also if I grab random axml and layout ids from my project (and not the ones I just imported from the online example) it also builds.
I think the issue might be:
one of the #dimens, #colors, etc is breaking my layouts, but I tried deleting them all from the .axml files with no luck.
my layout might be missing some code of declaration in the first Layout object aka RelativeLayout xmlns:android=
something I'm not catching is different in layouts in regular Android versus Xamarin android
NOTE:
All three blocks of code MUST be deleted / replaced
I have restarted my computer, restarted VS, deleted by obj/bin folders, etc.
I am recreating this project but with Xamarin Android C#: https://www.androidhive.info/2016/05/android-build-intro-slider-app/
I have the following code in my Activity OnCreate function: (NOTE that i point out which three blocks of code could be deleted in order for the build to work correctly)
class StartUpDialogs : Activity
{
...
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
// Making notification bar transparent
if ((int)Build.VERSION.SdkInt >= 21)
{
Window.DecorView.SystemUiVisibility = (StatusBarVisibility)(SystemUiFlags.LayoutStable | SystemUiFlags.LayoutFullscreen);
}
//REMOVING THE FOLLOWING THREE CODE BLOCKS ALLOWS IT TO BUILD
// Also replacing with Ids and Layouts not from this example work too
{
SetContentView(Resource.Layout.activity_welcome);
viewPager = FindViewById<ViewPager>(Resource.Id.view_pager);
dotsLayout = FindViewById<LinearLayout>(Resource.Id.layoutDots);
btnSkip = FindViewById<Button>(Resource.Id.btn_skip);
btnNext = FindViewById<Button>(Resource.Id.btn_next);
// layouts of all welcome sliders
// add few more layouts if you want
layouts = new int[]{
Resource.Layout.welcome_slide1,
Resource.Layout.welcome_slide2,
Resource.Layout.welcome_slide3,
Resource.Layout.welcome_slide4};
}
myViewPagerAdapter = new StartUpDialogAdapter(this, layouts);
viewPager.Adapter = (myViewPagerAdapter);
viewPager.PageSelected += OnPageChange;
btnSkip.Click += OnSkip;
btnNext.Click += GoNext;
}
...
}
Here are the layout files:
activity_welcome.axml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:showIn="#layout/activity_welcome">
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="#+id/layoutDots"
android:layout_width="match_parent"
android:layout_height="#dimen/dots_height"
android:layout_alignParentBottom="true"
android:layout_marginBottom="#dimen/dots_margin_bottom"
android:gravity="center"
android:orientation="horizontal"></LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:alpha=".5"
android:layout_above="#id/layoutDots"
android:background="#android:color/white" />
<Button
android:id="#+id/btn_next"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:background="#null"
android:text="#string/next"
android:textColor="#android:color/white" />
<Button
android:id="#+id/btn_skip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:background="#null"
android:text="#string/skip"
android:textColor="#android:color/white" />
</RelativeLayout>
welcome_slide1.axml (2 - 4 are identical except with numbers switched out for 2, 3, 4)
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/bg_screen1">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:orientation="vertical">
<ImageView
android:layout_width="#dimen/img_width_height"
android:layout_height="#dimen/img_width_height"
android:src="#drawable/ic_food" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/slide_1_title"
android:textColor="#android:color/white"
android:textSize="#dimen/slide_title"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:paddingLeft="#dimen/desc_padding"
android:paddingRight="#dimen/desc_padding"
android:text="#string/slide_1_desc"
android:textAlignment="center"
android:textColor="#android:color/white"
android:textSize="#dimen/slide_desc" />
</LinearLayout>
</RelativeLayout>
And my Resource files in case its them: (I had to move string-array into my strings.xml in order for them to be registered in my OnCreate function as the code owners project had it in colors.xml)
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#3F51B5</color>
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
<!-- Screens background color-->
<color name="bg_screen1">#f64c73</color>
<color name="bg_screen2">#20d2bb</color>
<color name="bg_screen3">#3395ff</color>
<color name="bg_screen4">#c873f4</color>
<!-- dots inactive colors -->
<color name="dot_dark_screen1">#d1395c</color>
<color name="dot_dark_screen2">#14a895</color>
<color name="dot_dark_screen3">#2278d4</color>
<color name="dot_dark_screen4">#a854d4</color>
<!-- dots active colors -->
<color name="dot_light_screen1">#f98da5</color>
<color name="dot_light_screen2">#8cf9eb</color>
<color name="dot_light_screen3">#93c6fd</color>
<color name="dot_light_screen4">#e4b5fc</color>
</resources>
dimens.xml
<resources>
<!-- Default screen margins, per the Android Design guidelines. -->
<dimen name="activity_horizontal_margin">16dp</dimen>
<dimen name="activity_vertical_margin">16dp</dimen>
<dimen name="fab_margin">16dp</dimen>
<dimen name="dots_height">30dp</dimen>
<dimen name="dots_margin_bottom">20dp</dimen>
<dimen name="img_width_height">120dp</dimen>
<dimen name="slide_title">30dp</dimen>
<dimen name="slide_desc">16dp</dimen>
<dimen name="desc_padding">40dp</dimen>
</resources>
Strings.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">XXX</string>
<string name="user_spinner_prompt">Select Account</string>
<string name="app_name">Intro Slider</string>
<string name="title_activity_welcome">Home Screen</string>
<string name="next">NEXT</string>
<string name="skip">SKIP</string>
<string name="start">GOT IT</string>
<string name="slide_1_title">Hello Food!</string>
<string name="slide_1_desc">The easiest way to order food from your favourite restaurant!</string>
<string name="slide_2_title">Movie Tickets</string>
<string name="slide_2_desc">Book movie tickets for your family and friends!</string>
<string name="slide_3_title">Great Discounts</string>
<string name="slide_3_desc">Best discounts on every single service we offer!</string>
<string name="slide_4_title">World Travel</string>
<string name="slide_4_desc">Book tickets of any transportation and travel the world!</string>
<string name="play_again_desc">To see the welcome slider again, goto Settings -> apps -> welcome slider -> clear data</string>
<string name="play_again">Play Again</string>
<string-array name="array_dot_active">
<item>#color/dot_light_screen1</item>
<item>#color/dot_light_screen2</item>
<item>#color/dot_light_screen3</item>
<item>#color/dot_light_screen4</item>
</string-array>
<string-array name="array_dot_inactive">
<item>#color/dot_dark_screen1</item>
<item>#color/dot_dark_screen2</item>
<item>#color/dot_dark_screen3</item>
<item>#color/dot_dark_screen4</item>
</string-array>
</resources>
try to check the axml which you copy from Java Project,set their BuildAction to AndroidResource like this:

Reduce space between spinner item

Any one could suggest how to reduce space between spinner items height having radio buttons.
My Code is below .
Layout
<Spinner android:layout_width="250dp"
android:layout_height="40dp"
android:id="#+id/spinnerCompany"
android:theme="#style/SpinnerTheme"
android:background="#android:drawable/btn_dropdown" />
Spinner Theme
<style name="SpinnerTheme">
<item name="android:layout_width" >fill_parent</item>
<item name="android:textSize" >15dp</item>
<item name="android:layout_width" >fill_parent</item>
<!--<item name="colorAccent">#00f</item>
<item name="colorControlNormal">#00f</item>-->
</style>
Activity Code
ArrayAdapter CompanyAdapter = new ArrayAdapter(this, Android.Resource.Layout.SimpleSpinnerItem, cls_static.ToArrayList(ListofCompnyFromDB));
CompanyAdapter.SetDropDownViewResource(Android.Resource.Layout.SelectDialogSingleChoice);
spinnerCompanyObj.Adapter = (CompanyAdapter);
Getting output like below any help would be appreciated.
You can add the android:dropDownWidth="100dp" in Spinner
<Spinner android:layout_width="250dp"
android:dropDownWidth="100dp"
android:layout_height="40dp"
android:id="#+id/spinnerCompany"
android:theme="#style/SpinnerTheme"
android:background="#android:drawable/btn_dropdown" />
There is running screenshot.
I have made a minor change like below and it get resolved.
Activity
CompanyAdapter.SetDropDownViewResource(Resource.Drawable.styl_spinner_style);
styl_spinner_style
<?xml version="1.0" encoding="utf-8"?>
<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/text1"
style="?android:attr/spinnerDropDownItemStyle"
android:singleLine="true"
android:layout_width="match_parent"
android:layout_height="37dp"
android:ellipsize="marquee"
android:checkMark="?android:attr/listChoiceIndicatorSingle"
android:textColor="#252c3b"/>

Progress Bar in Theme

I have been having problems with incorporating a Progress Bar into my splash screen. I have an XML file called splash_setup,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background">
<bitmap
android:src="#drawable/splash"
android:tileMode="disabled"
android:gravity="top|center_horizontal" />
<ProgressBar
style="#android:style/Widget.ProgressBar.Small"
android:gravity="top|center_horizontal" />
</LinearLayout>
This file is used as background for 'splashTheme' (in Styles.XML) as following,
?xml version="1.0" encoding="utf-8" ?>
<resources>
<style name="splashTheme" parent="android:Theme">
<item name="android:windowBackground">#drawable/splash_setup</item>
<item name="android:windowNoTitle">true</item>
</style>
</resources>
The splashTheme is used in splashActivity (the splash executes database initialisation and then finished),
[Activity(Label = "#string/appName", Theme = "#style/splashTheme",
MainLauncher = true, NoHistory = true)]
So to my problem... the splash_setup code runs fine without tags, but when they are in I get the following error,
android.content.res.Resources$NotFoundException: File res/drawable/splash_setup.xml from drawable resource ID #0x7f020002
Could anyone point out what I am doing wrong? Thanks!
What you have is a layout not a drawable. android:windowBackground attribute in style allows only drawable which may include shapes and/or layer lists. If you really wish to show a progressbar, then you need an activity.

No resource found that matches the given name (at 'headerLayout') in Xamarin.Android

I'm creating Android app using Xamarin for Android. I want to use in my app NavigationDrawer, so I downloaded and installed 'Android Design Library' from Xamarin Components Store. Then I edited my layout for this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawerLayout"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:fitsSystemWindows="true">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/articlesListView" />
<android.support.design.widget.NavigationView
android:id="#+id/navView"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/navHeader"
app:menu="#menu/navMenu"/>
</android.support.v4.widget.DrawerLayout>
navHeader.axml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="192dp"
android:background="?attr/colorPrimaryDark"
android:padding="16dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
android:orientation="vertical"
android:gravity="bottom">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Username"
android:textAppearance="#style/TextAppearance.AppCompat.Body1"/>
</LinearLayout>
and menu/navMenu.xml:
<?xml version="1.0" encoding="UTF-8" ?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group android:checkableBehavior="single">
<item
android:id="#+id/nav_home"
android:title="Home" />
<item
android:id="#+id/nav_messages"
android:title="Messages" />
<item
android:id="#+id/nav_friends"
android:title="Friends" />
<item
android:id="#+id/nav_discussion"
android:title="Discussion" />
</group>
<item android:title="Sub items">
<menu>
<item
android:title="Sub item 1" />
<item
android:title="Sub item 2" />
</menu>
</item>
</menu>
Unfortunately while compiling, I received following error:
C:\Project\Project\File.axml: Error APT0000: No resource found that
matches the given name (at 'headerLayout' with value
'#layout/navHeader'). (APT0000) (AppName)
C:\Projects\Project\File.axml(0,0): Error APT0000: No resource found
that matches the given name (at 'menu' with value '#menu/navMenu').
(APT0000) (AppName)
Somebody knows how I may solved this problem?
Thank you in advance
I had the same issue.
I simply put lower case letters in the name of the header layout file and it worked.
Before (Failing with same error message):
app:headerLayout="#layout/DrawerHeader"
After:
app:headerLayout="#layout/drawerheader"
Named Your layout file and menu with the small letter.
app:headerLayout="#layout/drawerheader"
app:menu="#menu/drawermenu"
Had the same problem. Guess it is a bug. C# code addition (in OnCreate() method of your activity) of navigation header view and menu view works fine for me. That is done with NavigationView methods InflateMenu and inflateHeaderView.
EDIT
First delete
app:headerLayout="#layout/navHeader"
and
app:menu="#menu/navMenu"
from your Navigation Drawer layout and insert
navigationView = FindViewById<NavigationView>(Resource.Id.navView);
navigationView.InflateHeaderView(Resource.Layout.navHeader);
navigationView.InflateMenu(Resource.Menu.navMenu);
somewhere in onCreate() method of your activity in question.

Border Class analog in Xamarin Android

I want to draw a candlestick chart (500 itmes). In WPF, I can use 500 borders (System.Windows.Controls.Border) inside 1 scrollviewer.
I also can change any item when it's needed.
How can I do the same in Xamarin.Android? Xamarin.Android doesn't contain the Border class.
you could use a ScrollView, containing a LinearLayout containing itself 500 times a simple <View> that has a size and a drawable stroke as background
something like
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom"
>
<View
android:layout_width="50dp"
android:layout_height="100dp"
android:background="#drawable/border_white"
/>
<View
android:layout_width="50dp"
android:layout_height="50dp"
android:background="#drawable/border_white"
/>
and in res/drawable, a file named border_white
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="2dip" android:color="#android:color/white" />
</shape>
but it'll be pretty slow I tell you (like on Windows, probably).

Categories