Two tabs in TabbedPage are not taking full width instead they are limited to their text width to the left corner of the tab - xamarin.forms

I have to populate two tabs in TabbedPage in such a way that two tabs should take equal half widths of the tab.
Here is my code in TabbedPage:
protected override void OnAppearing()
{
base.OnAppearing();
EquipmentGeneralInfoTab = new EquipmentGeneralInfoTab() { Title = "General" };
EquipmentMaintenanceTab = new EquipmentMaintenanceTab() { Title = "Maintenance" };
this.Children.Add(EquipmentGeneralInfoTab);
this.Children.Add(EquipmentMaintenanceTab);
}
Xaml code:
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="TCRMobile.Pages.EquipmentInfoTabbedPage"
Title="Equipment">
Tabbar.xaml:
<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/Your.Theme"
app:tabIndicatorColor="#color/tcr_green"
app:tabSelectedTextColor="#color/tcr_green"
app:tabTextColor="#color/black"
app:tabGravity="fill"
app:tabMaxWidth="0dp"
app:tabTextAppearance="#style/tab_text"
app:tabMode="scrollable" />
How to accomplish my requirement?

Try to change the following code in Tabbar.xaml
app:tabMode="scrollable"
To
app:tabMode="fixed"

Related

leanback poster lost position after overriding the lb_fullwidth_details_overview_logo

can you please help me to know how can I change the text below the poster in leanback details view content without losing the position?
this is the code I used:
lb_fullwidth_details_overview_logo
<?xml version="1.0" encoding="utf-8"?><!-- This is an override of the full width details overview logo layout -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/container"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/details_overview_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:elevation="#dimen/lb_details_overview_z"
android:maxHeight="#dimen/lb_details_v2_logo_max_height"
android:maxWidth="#dimen/lb_details_v2_logo_max_width" />
<TextView
android:id="#+id/statusText"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
CustomDetailsOverviewLogoPresenter
class CustomDetailsOverviewLogoPresenter(private val entitlementStatus: String) :
DetailsOverviewLogoPresenter() {
internal class ViewHolder(view: View?) :
DetailsOverviewLogoPresenter.ViewHolder(view) {
override fun getParentPresenter(): FullWidthDetailsOverviewRowPresenter {
return mParentPresenter
}
override fun getParentViewHolder(): FullWidthDetailsOverviewRowPresenter.ViewHolder {
return mParentViewHolder
}
}
override fun onCreateViewHolder(parent: ViewGroup): Presenter.ViewHolder {
val cardView = DetailsOverviewCardView(parent.context)
val width: Int = ViewGroup.LayoutParams.WRAP_CONTENT
val height: Int = ViewGroup.LayoutParams.WRAP_CONTENT
cardView.layoutParams = MarginLayoutParams(width, height)
return ViewHolder(cardView)
}
override fun onBindViewHolder(viewHolder: Presenter.ViewHolder, item: Any) {
val row = item as DetailsOverviewRow
val cardView = viewHolder.view as DetailsOverviewCardView
val imageView = cardView.imageView
val status = cardView.statusText
status.text = entitlementStatus
imageView.setImageDrawable(row.imageDrawable)
if (isBoundToImage(viewHolder as ViewHolder, row)) {
viewHolder.parentPresenter.notifyOnBindLogo(viewHolder.parentViewHolder)
}
}
}
but now the image is not in the position it must be
You need to create a custom DetailsOverviewLogoPresenter. When you construct your FullWidthDetailsOverviewRowPresenter, the first parameter is the Presenter to use to render the description and the second one is the DetailsOverviewLogoPresenter.
In your DetailsOverviewLogoPresenter, implement onCreateView (to inflate and return the view you want to use), onCreateViewHolder (to wrap the returned view in a ViewHolder), and onBindViewHolder (to use the ViewHolder to set up the views including the image and your custom TextView's text).
The official sample has a setupAdapter method that shows how to create and use custom presenters.

How to draw on PreviewView?

I have a PreviewView instance on which i want to draw a rect based on object identifies using Firebase and Image Analyser use case.
However, unlike in Text/ SurfaceView PreviewView doesn't let any Canvas to be drawn on top of it.
What's the alternative?
Further Edits:
Tried the below earlier:
Canvas objectFrameCanvas = new Canvas();
Paint pen = new Paint();
pen.setColor(Color.RED);
pen.setStrokeWidth(8F);
pen.setStyle(Paint.Style.STROKE);
objectFrameCanvas.drawRect(100,150,200, 250, pen);
TextureView textureView = new TextureView(this);
textureView.draw(objectFrameCanvas);
mPreviewView.addView(textureView);
Create a child forviewgroup : textureView.
Make new canvas objectFrameCanvas, draw rectangle on it, then draw canvas on textureView. Then add this to view group (PreviewView)
Still doesnt give me the requisite result it should.
By the way am using this inside my ImageAnanysis usecase
imageAnalysis.setAnalyzer(executor, new ImageAnalysis.Analyzer() {....}
To draw on top of your preview, you can create a custom view which draws a rectangle with the list of RectF you give it. Here's a gist of it:
class RectOverlay constructor(context: Context?, attributeSet: AttributeSet?) :
View(context, attributeSet) {
override fun onDraw(canvas: Canvas) {
super.onDraw(canvas)
// Pass it a list of RectF (rectBounds)
rectBounds.forEach { canvas.drawRect(it, paint) }
}
}
And use this custom view in your layout:
<androidx.constraintlayout.widget.ConstraintLayout
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">
<androidx.camera.view.PreviewView
android:id="#+id/preview_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.example.RectOverlay
android:id="#+id/rect_overlay"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Here is a good repo to check which uses CameraX and draws rectangular bounds over detected faces: https://github.com/husaynhakeem/android-playground/tree/master/FaceDetectorSample

Navigation component - handle back behaviour with multiple stacks

My main problem is that the back button(device button) is not working properly as findNavController().navigateUp() does.
I have the following structure.
Main nav graph:
Login -> Home, here FlowA and FlowB are loaded in DrawerLayout
HomeFragment code:
class HomeFragment : Fragment() {
private var _binding: FragmentHomeBinding? = null
private val binding get() = _binding!!
private val viewModel: HomeViewModel by activityViewModels()
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
_binding = FragmentHomeBinding.inflate(inflater, container, false)
val flow1Nav = NavHostFragment.create(R.navigation.flow_a)
val flow2Nav = NavHostFragment.create(R.navigation.flow_b)
childFragmentManager.beginTransaction()
.add(R.id.flContent, flow1Nav, flow1Nav.javaClass.name)
.add(R.id.flContent, flow2Nav, flow2Nav.javaClass.name)
.show(flow1Nav)
.hide(flow2Nav)
.commitNow()
binding.navView.findViewById<LinearLayout>(R.id.ll_flow1).setOnClickListener {
binding.drawerLayout.closeDrawers()
childFragmentManager.beginTransaction()
.show(flow1Nav)
.hide(flow2Nav)
.commit()
}
binding.navView.findViewById<LinearLayout>(R.id.ll_flow2).setOnClickListener {
binding.drawerLayout.closeDrawers()
childFragmentManager.beginTransaction()
.show(flow2Nav)
.hide(flow1Nav)
.commit()
}
}
}
fragment_home.xml
<?xml version="1.0" encoding="utf-8"?>
<!-- Use DrawerLayout as root container for activity -->
<androidx.drawerlayout.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<FrameLayout
android:id="#+id/flContent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<!-- Container for contents of drawer - use NavigationView to make configuration easier -->
<com.google.android.material.navigation.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/drawer_header" />
<include layout="#layout/drawer_menu" />
</LinearLayout>
</com.google.android.material.navigation.NavigationView>
</androidx.drawerlayout.widget.DrawerLayout>
Flow A nav graph
Flow B nav graph
Questions
Why findNavController().navigateUp() works as expected and the device back button doesn't?
Multiple stacks (navigations graphs) breaks the navigation system?
All the source code can be found here.
I've found a workarround
requireActivity().onBackPressedDispatcher.addCallback(viewLifecycleOwner) {
findNavController().navigateUp()
}

How replace a navigation icon with a navigation title in xamarin forms

I trying to add a navigation title icon to my app in one of the page and the code that i have used is:
For iOS:
NavigationPage.SetTitleIcon(this, "icon.png");
For Android in the ToolBar.axml I have added a ImageView as shown below:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<ImageView
android:id="#+id/titleicon"
android:src="#drawable/UstNameIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>
The issue is that, I want my Navigtion icon to get disabled in my next Page and put a title instead of icon.
For that, I tried
For iOS:
NavigationPage.SetTitleIcon(this, null);
NavigationPage.Title="Title";
For Android, How can i achieve the change of Navigation title?
In MainActivity.cs
[Activity (Label = "Todo.Android.Android", MainLauncher = true, Icon="#android:color/transparent")]
For Title, you can set Title property in xaml or c#
To change text you just simple need to find that element by id, and set up a title:
var toolbar =
FindViewById<Android.Support.V7.Widget.Toolbar>(Resource.Id.toolbar); // it may be simplifed
SetSupportActionBar(toolbar);
toolbar.Title = "title";
And image is under toolbar.Logo, so you can just try:
toolbar.Logo = null;
If you have some data in resources which you want to put in, you can use also:
toolbar.SetTitle();
toolbar.SetLogo();

My ViewLabel under Nutiteq doesn't work fine

I can populate the view for my ViewLabel in Nutiteq but I can't set right text in the text views of this Layout .
My code is following
//Setting Popup Label if we click the area
LayoutInflater inflater = (LayoutInflater) this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View labelView = inflater.inflate(R.layout.popup_field, null);
//In order to get a dynamic "redimensionable" Ballon aka ViewLabel
labelView.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
labelView.layout(0, 0, labelView.getMeasuredWidth(), labelView.getMeasuredHeight());
//labelView.measure(400, 400);
//labelView.layout(100, 100, 400, 400);
Log.info("drawField:: Nach Label fieldLabel = new ViewLabel... ");
LinearLayout lLayout = (LinearLayout)labelView.findViewById(R.id.layout1);
lLayout.setBackgroundColor(Color.RED);
TextView farmNameTV = (TextView)labelView.findViewById(R.id.farmName);
TextView areaTV = (TextView)labelView.findViewById(R.id.area);
TextView statusTV = (TextView)labelView.findViewById(R.id.status);
farmNameTV.setTextColor(Color.BLACK);
farmNameTV.setText("Farm CacoCaCoca");
areaTV.setTextColor(Color.BLACK);
String areaString = "12.34"
areaTV.setText("Area "+areaString);
statusTV.setTextColor(Color.BLACK);
String statusString = "Status:::qwertzuiopasdfghjklyxcvbnm";
statusTV.setText(statusString);
*What you can see red is my inflated View.
R.layout.popup_field looks like this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/farmName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/farmName"/>
<TextView
android:id="#+id/area"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/area"/>
<TextView
android:id="#+id/status"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/status"/>
where strings are
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="app_name">Nutiteq3D</string>
<string name="area">Area</string>
<string name="status">Status</string>
<string name="farmName">Farm Name</string>
</resources>
Have anyone done this task already? Can anyone help me to find out my error(s)?
With MapView of google Api is easy but I develop this with Nutiteq and just pure Activities, so, NO fragments and to inflate we typically need a ViewGroup and this ViewGroup under G-Api would be MapView so inherits from ViewGroup but in Nutiteq is not like this, MapView of Nutiteq inherits of android.view and I can't casting, I can just assign as ViewGroup a null in the call of inflateas you can see.
So, people, I'd be very thankful for your help.
Kind Regards
Solved!
It didn't have to do with ViewLabel but the normal Android.View, I wanted to assign Text to TextView's after I declared my resizable View and therefore it didn't work fine.
So the solution is writing all of tv.setText above
labelView.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
labelView.layout(0, 0, labelView.getMeasuredWidth(), labelView.getMeasuredHeight());

Resources