Code Monkey home page Code Monkey logo

ui-fabric-android's Introduction

This repo has moved and has been archived. Please use https://github.com/microsoft/fluentui-android instead.

Build status GitHub release

The Android UI framework for building experiences for Office and Office 365.

Office UI Fabric for Android is a native library that provides the Office UI experience for the Android platform. It contains information about colors and typography, as well as custom controls and customizations for platform controls, all from the official Fluent design language used in Office and Office 365 products.

Contents

Colors and typography

Office UI Fabric for Android provides colors and typography based on the Fluent design language.

Controls

Office UI Fabric for Android includes an expanding library of controls written in Kotlin. These controls implement the Fluent design language and bring consistency across Office app experiences.

Some of the controls available include:

  • AvatarView
  • Button styles
  • BottomSheet
  • CalendarView
  • CircularProgress styles
  • DateTimePickerDialog
  • Drawer
  • ListItemView
  • PeoplePickerView
  • PersonaChipView
  • PersonaListView
  • PersonaView
  • Snackbar
  • TemplateView
  • Tooltip

A full list of currently supported controls can be found here: OfficeUIFabric.

Install and use Office UI Fabric

Requirements

API 21+

1. Using Gradle

  • Our library is published through JCenter, so make sure the jcenter() repository has been added to your project level build.gradle file (which usually is automatic).

  • Inside the dependency block in your build.gradle, add this line for the OfficeUIFabric library:

dependencies {
    ...
    implementation 'com.microsoft.uifabric:OfficeUIFabric:$version'
    ... 
}
  • Make sure you replace $version with the latest version of OfficeUIFabric.

2. Using Maven

  • Add the OfficeUIFabric library as a dependency:
<dependency>
  <groupId>com.microsoft.uifabric</groupId>
  <artifactId>OfficeUIFabric</artifactId>
  <version>${version}</version>
</dependency>
  • Make sure you replace ${version} with the latest version of OfficeUIFabric.

3. Manual installation

  • Download the latest changes from the Office UI Fabric Android repository.

  • Follow these instructions to build and output an AAR file from the OfficeUIFabric module, import the module to your project, and add it as a dependency. If you're having trouble generating an AAR file for the module, make sure you select it and run "Make Module 'OfficeUIFabric'" from the Build menu.

  • Some components have dependencies you will need to manually add to your app if you are using this library as an AAR artifact because these dependencies do not get included in the output.

    • If using PeoplePickerView, include this dependency in your gradle file:
      implementation 'com.splitwise:tokenautocomplete:2.0.8'
    • If using CalendarView or DateTimePickerDialog, include this dependency in your gradle file:
      implementation 'com.jakewharton.threetenabp:threetenabp:1.1.0'
    • Double check that these library versions correspond to the latest versions we implement in the OfficeUIFabric build.gradle.

Import and use the library

In code:

import com.microsoft.officeuifabric.persona.AvatarView

In XML:

<com.microsoft.officeuifabric.persona.AvatarView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:name="Mona Kane" />

Demo app

Included in this repository is a demo of currently implemented controls. A full list of implemented controls available in the demo can be found here: Demos.

To see samples of all of our implemented controls and design language, run the OfficeUIFabric.Demo module in Android Studio.

Contributing

Post bug reports, feature requests, and questions in Issues.

Changelog

We use GitHub Releases to manage our releases, including the changelog between every release. You'll find a complete list of additions, fixes, and changes on the Releases page.

License

All files on the Office UI Fabric for Android GitHub repository are subject to the MIT license. Please read the LICENSE file at the root of the project.

Usage of the logos and icons referenced in Office UI Fabric for Android is subject to the terms of the assets license agreement.

ui-fabric-android's People

Contributors

aconsuegra avatar etitalnegev avatar lynamemi avatar vladfilyakov avatar williamado avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

ui-fabric-android's Issues

How to use Fluent Design?

Can you show how to use Fluent with a specific example? Namely, on Xamarin.Android and Xamarin.IOS.

Option to set first of week in CalendarView

Hi,

We are trying to change the first day of week for the CalendarView, to use either the device system setting or a local setting. We have seen in the repo a PreferenceManager with a function to retrieve the first day of the week stored in shared preferences, but we can't find an exposed way of modifying those preferences. Are we missing anything? Could you point us to the documentation about how to use this PreferenceManager?

Thanks!

Bitmap support for BottomSheetItem

For my project I need to be able to provide bitmaps instead of android resource ids to the BottomSheetItem. I Implemented the functionality and tested around with it for a bit and would like to contribute my code changes. What do I have to do?

DateTimePicker large font/language text cut off

When using a device setting to increase the font size, in date picker time selection tab, the dates are getting cut off in the following scenarios.

  • Largest font size is set, date for the next year selected (English)
  • For some languages, formatted date is very long and issue occurs with default font size as well when selecting a date for next year (Portuguese used for testing here)
  • Affects both, portrait and landscape, tested on Pixel 3, API 29.

We could adjust the padding to partially resolve this. For long language combined with big text, just padding will not cover it, so might need to remove some date information when time tab is selected, potentially day of the week or year? And as another approach, text could autosize down to fit into the available width (but this could create accessibility problem if it is not big enough for user to see after autosizing down).

Screenshots:
Screenshot_1585561270
Screenshot_1585561275
Screenshot_1585561617

Not getting crash report

CrashlyticsCore.getInstance().crash()

Result : (Not getting crash report, check my logs)

E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.app.xxxxx, PID: 31789
java.lang.ArrayIndexOutOfBoundsException: length=2; index=10
at com.crashlytics.android.core.CrashTest.indexOutOfBounds(CrashTest.java:30)
at com.crashlytics.android.core.CrashlyticsCore.crash(CrashlyticsCore.java:635)
at com.app.xxxxx.home.VentureCardFragment$onViewCreated$3.onClick(VentureCardFragment.kt:96)
at android.view.View.performClick(View.java:6597)
at android.view.View.performClickInternal(View.java:6574)
at android.view.View.access$3100(View.java:778)
at android.view.View$PerformClick.run(View.java:25885)
at android.os.Handler.handleCallback(Handler.java:873)
at android.os.Handler.dispatchMessage(Handler.java:99)
at android.os.Looper.loop(Looper.java:193)
at android.app.ActivityThread.main(ActivityThread.java:6669)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:493)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:858)
D/CrashlyticsCore: Crashlytics is handling uncaught exception "java.lang.ArrayIndexOutOfBoundsException: length=2; index=10" from thread main
E/CrashlyticsCore: Tried to write a fatal exception while no session was open.
D/CrashlyticsCore: Logging Crashlytics event to Firebase
D/CrashlyticsCore: No open sessions to be closed.
D/CrashlyticsCore: Opening a new session with ID 5D1356640315-0002-7C2D-0C1FE6FDD584
D/CrashlyticsCore: Crashlytics completed exception processing. Invoking default exception handler.

Drawer can only put a PersonListView?

when I put a RecycleView,the Drawer doesn't show anything,but when i click item,it can trigger the click listener.So I change it to PersonListView,the Drawer works correctly.Why?

CalendarView day name in Russian

Right now, the CalendarView is using only one letter as week day name in most (if not all) languages, including Russian.

According to our translators, having only one letter for week days makes no sense in Russian (same for Ukrainian and Belorussians) so the library should be using the 2 letters form, like seen in this screenshot:

Screenshot_1580214604

DateTimePicker landscape width

Date picker in landscape mode on a phone is very wide, compared to portrait width or to tablet implementation. Could the width be adjusted to be less wide and to make more days visible?

Screenshot_1578647490
Screenshot_1578647548

When i Use DateTimePickerDialog, it crashed

2019-06-05 02:08:56.314 21201-21201/com.azalea.www.samplehub E/AndroidRuntime: FATAL EXCEPTION: main
Process: com.azalea.www.samplehub, PID: 21201
android.view.InflateException: Binary XML file line #16: com.microsoft.officeuifabric.datetimepicker.DateTimePicker$onTabSelectedListener$1 cannot be cast to com.google.android.material.tabs.TabLayout$BaseOnTabSelectedListener
Caused by: java.lang.ClassCastException: com.microsoft.officeuifabric.datetimepicker.DateTimePicker$onTabSelectedListener$1 cannot be cast to com.google.android.material.tabs.TabLayout$BaseOnTabSelectedListener
at com.microsoft.officeuifabric.datetimepicker.DateTimePicker.onFinishInflate(DateTimePicker.kt:160)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:867)
at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:821)
at android.view.LayoutInflater.rInflate(LayoutInflater.java:861)
at android.view.LayoutInflater.rInflateChildren(LayoutInflater.java:821)
at android.view.LayoutInflater.inflate(LayoutInflater.java:518)
at android.view.LayoutInflater.inflate(LayoutInflater.java:426)
at com.microsoft.officeuifabric.datetimepicker.DateTimePickerFragment.onCreateView(DateTimePickerFragment.kt:48)
at androidx.fragment.app.Fragment.performCreateView(Fragment.java:2612)
at androidx.fragment.app.FragmentManagerImpl.moveToState(FragmentManagerImpl.java:874)
at androidx.fragment.app.FragmentManagerImpl.moveFragmentToExpectedState(FragmentManagerImpl.java:1228)
at androidx.fragment.app.FragmentManagerImpl.moveToState(FragmentManagerImpl.java:1293)
at androidx.fragment.app.BackStackRecord.executeOps(BackStackRecord.java:439)
at androidx.fragment.app.FragmentManagerImpl.executeOps(FragmentManagerImpl.java:2066)
at androidx.fragment.app.FragmentManagerImpl.executeOpsTogether(FragmentManagerImpl.java:1856)
at androidx.fragment.app.FragmentManagerImpl.removeRedundantOperationsAndExecute(FragmentManagerImpl.java:1811)
at androidx.fragment.app.FragmentManagerImpl.execSingleAction(FragmentManagerImpl.java:1686)
at androidx.fragment.app.BackStackRecord.commitNowAllowingStateLoss(BackStackRecord.java:299)
at androidx.fragment.app.FragmentPagerAdapter.finishUpdate(FragmentPagerAdapter.java:230)
at androidx.viewpager.widget.ViewPager.populate(ViewPager.java:1244)
at androidx.viewpager.widget.ViewPager.populate(ViewPager.java:1092)
at androidx.viewpager.widget.ViewPager.onMeasure(ViewPager.java:1622)
at com.microsoft.officeuifabric.view.WrapContentViewPager.onMeasure(WrapContentViewPager.kt:101)
at android.view.View.measure(View.java:19857)
at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:6083)
at android.widget.LinearLayout.measureChildBeforeLayout(LinearLayout.java:1464)
at android.widget.LinearLayout.measureVertical(LinearLayout.java:758)
at android.widget.LinearLayout.onMeasure(LinearLayout.java:640)
at android.view.View.measure(View.java:19857)
at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:6083)
at android.widget.FrameLayout.onMeasure(FrameLayout.java:185)
at androidx.cardview.widget.CardView.onMeasure(CardView.java:260)
at android.view.View.measure(View.java:19857)
at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:6083)
at android.widget.FrameLayout.onMeasure(FrameLayout.java:185)
at android.view.View.measure(View.java:19857)
at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:6083)
at android.widget.FrameLayout.onMeasure(FrameLayout.java:185)
at android.view.View.measure(View.java:19857)
at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:6083)
at android.widget.LinearLayout.measureChildBeforeLayout(LinearLayout.java:1464)
at android.widget.LinearLayout.measureVertical(LinearLayout.java:758)
at android.widget.LinearLayout.onMeasure(LinearLayout.java:640)
at android.view.View.measure(View.java:19857)
at android.view.ViewGroup.measureChildWithMargins(ViewGroup.java:6083)
at android.widget.FrameLayout.onMeasure(FrameLayout.java:185)
at com.android.internal.policy.DecorView.onMeasure(DecorView.java:690)
2019-06-05 02:08:56.314 21201-21201/com.azalea.www.samplehub E/AndroidRuntime: at android.view.View.measure(View.java:19857)
at android.view.ViewRootImpl.performMeasure(ViewRootImpl.java:2275)
at android.view.ViewRootImpl.measureHierarchy(ViewRootImpl.java:1339)
at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:1619)
at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1254)
at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:6338)
at android.view.Choreographer$CallbackRecord.run(Choreographer.java:874)
at android.view.Choreographer.doCallbacks(Choreographer.java:686)
at android.view.Choreographer.doFrame(Choreographer.java:621)
at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:860)
at android.os.Handler.handleCallback(Handler.java:751)
at android.os.Handler.dispatchMessage(Handler.java:95)
at android.os.Looper.loop(Looper.java:154)
at android.app.ActivityThread.main(ActivityThread.java:6169)
at java.lang.reflect.Method.invoke(Native Method)
at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:891)
at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:781)

i add andoridX support ,not andorid.support。but if this project can run with kotlin, please migrate to androidX

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.