Tôi đang cố gắng để phù hợp với một thiết kế như thế này ..
Lưu ý rằng "tông màu của tab đã chọn" là màu xanh lam, nhưng biểu tượng của tab trung tâm phải luôn là vòng tròn màu xanh lá cây với đồng hồ màu trắng ở giữa.
Tôi đã thử một số thứ. Trước tiên, hãy thử làm điều đó bằng lập trình bằng cách sử dụng tài nguyên XML trong danh sách lớp có tài nguyên PNG vòng tròn màu xanh lá cây và đồng hồ, không hoạt động. Sau đó, tôi đã nhờ nhà thiết kế đưa cho tôi biểu tượng đầy đủ (đồng hồ và vòng tròn màu xanh lá cây), nhưng bây giờ tôi đang gặp phải vấn đề này ..
(Không được chọn)
(Đã chọn)
Tôi không tìm được thuật ngữ chính xác để tìm kiếm trên Google để sửa lỗi này.
Cuối cùng, tôi cần màu tab đã chọn là màu xanh lam, nhưng tôi cần biểu tượng tab trung tâm luôn là biểu tượng thực tế không có màu bổ sung (về cơ bản nó cần trông giống hệt như .png).
PS: Tôi đang sử dụng Xamarin.Forms, FreshMvvm và FreshTabbedFONavlationContainer. Tuy nhiên, thông qua Trình kết xuất, tôi có quyền truy cập trực tiếp vào bottomNavlationView và tất cả các thành phần Android gốc khác. Vì vậy, giải pháp không phải là một giải pháp Xamarin. Một giải pháp java / kotlin cũng sẽ hoạt động và tôi chỉ có thể chuyển đổi nó thành Xamarin.
======================
EDITED:
======================
Vì vậy, tôi đã nhận được nhiều hơn nữa bằng cách sử dụng mã của Andres Castro dưới đây, nhưng tôi vẫn gặp vấn đề tương tự như trước đây. Sử dụng mã của Andres bên dưới, tôi quay lại sử dụng FontAwgie cho các biểu tượng (hoạt động rất tốt), nhưng khi làm như vậy có nghĩa là tôi cần sử dụng một LayerDrawable
để tạo biểu tượng tab vòng tròn / biểu tượng trung tâm.
Vì vậy, đây là những gì tôi có cho đến nay ..
Biểu tượng trung tâm không được chọn
Biểu tượng trung tâm được chọn
Như bạn có thể thấy, biểu tượng trung tâm vẫn có màu xám khi không được chọn và màu xanh lam khi được chọn (màu được chọn / không được chọn đúng của 4 biểu tượng khác).
Đây là mã tôi có liên quan đến biểu tượng trung tâm ..
Cập nhậtTabbedIcons
private void UpdateTabbedIcons()
{
for (var i = 0; i < Element.Children.Count; i++) {
var tab = _bottomNavigationView.Menu.GetItem(i);
var element = Element.Children[i];
if (element is NavigationPage navigationPage) {
//if the child page is a navigation page get its root page
element = navigationPage.RootPage;
}
UpdateTabIcon(tab, element);
}
}
Cập nhậtTabIcon
public void UpdateTabIcon(IMenuItem menuItem, Page page)
{
var icon = page?.Icon;
if (icon == null) return;
var drawable = new IconDrawable(Context, icon, "fa-regular-pro-400.ttf");
var element = Element.CurrentPage;
if (element is NavigationPage navigationPage) {
//if the child page is a navigation page get its root page
element = navigationPage.RootPage;
}
if (page is DoNowTabPage) { //Page for center icon
drawable.Color(Helpers.Resources.White.ToAndroid());
var finalDrawable = GetCombinedDrawable(drawable);
menuItem.SetIcon(finalDrawable);
return;
} else if (element == page) {
drawable.Color(BarSelectedItemColor.ToAndroid());
} else {
drawable.Color(BarItemColor.ToAndroid());
}
menuItem.SetIcon(drawable);
}
GetCombinedDrawable
private Drawable GetCombinedDrawable(IconDrawable iconDrawable)
{
var displayMetrics = Resources.DisplayMetrics;
GradientDrawable circleDrawable = new GradientDrawable();
circleDrawable.SetColor(Helpers.Resources.Green.ToAndroid());
circleDrawable.SetShape(ShapeType.Oval);
circleDrawable.SetSize((int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 500, displayMetrics), (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 500, displayMetrics));
circleDrawable.Alpha = 1;
var inset = (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 140, displayMetrics);
var bottomInset = (int)TypedValue.ApplyDimension(ComplexUnitType.Dip, 40, displayMetrics);
LayerDrawable finalDrawable = new LayerDrawable(new Drawable[] { circleDrawable, iconDrawable });
finalDrawable.SetLayerHeight(1, iconDrawable.IntrinsicHeight);
finalDrawable.SetLayerWidth(1, iconDrawable.IntrinsicWidth);
finalDrawable.SetLayerInset(1, inset, inset, inset, inset + bottomInset);
finalDrawable.SetLayerInsetBottom(0, bottomInset);
finalDrawable.ClearColorFilter();
return finalDrawable;
}
Như bạn có thể thấy trong phần GradientDrawable
tôi đang tạo cho vòng tròn, tôi đang đặt màu của nó thành màu Xanh lục của mình (Tôi có một lớp tùy chỉnh được gọi là Tài nguyên..không phải là Resources
lớp Android ).
Vì vậy, đó là nơi tôi bị mắc kẹt. Tôi đang đặt vòng tròn có thể vẽ thành màu xanh lục, nhưng một lần trong bottomNavulationView, màu của nó luôn khớp với các màu không được chọn / chọn của các biểu tượng khác.
Hy vọng sẽ vượt qua vấn đề cuối cùng này. Cảm ơn vì bất kì sự giúp đỡ.
_bottomNavigationView.ItemIconTintList = null;