Home

Awesome

Skycons for Android Android Arsenal

<p align="center"> <img src="https://github.com/torryharris/Skycons/blob/master/Skycons/skycons.gif" alt="Skycons"/> </p>

We set out to create a native weather app on Xamarin but we wanted to build something unique to differentiate ourselves amongst the plethora of weather apps avaialble out there. The DarkSky app & Forecast did an excellent job with their Skycons.

We wanted to re-use the same icons for our app as well, however, we found that these animated icons don't exist natively on either platforms. This is currently a work-in-progress as the team is finetuning the animation & the performance itself. You can download the complete repository which also contains the sample project SkyconsDemo.

Built with Android Studio (2.2.3)

Available Icons

IconView
CloudCloudView
Clear Sky (Sunny)SunView
Clear NightMoonView
Partly Cloudy DayCloudSunView
Partly Cloudy NightCloudMoonView
Heavy ShowersCloudHvRainView
SnowCloudSnowView
Light ShowersCloudRainView
FogCloudFogView
WindWindView
ThunderCloudThunderView

How to use

Adding icons:

1) To add a skycon(icon) through the XML:
                 
       <com.thbs.skycons.library.<skycon>
         android:layout_width="250dp"
         android:layout_height="250dp"
         android:layout_centerHorizontal="true"
         android:layout_centerVertical="true"
         app:isStatic = "true"
         app:strokeColor = "#000000"
         app:bgColor = "#ffffff"/>

where <skycon> represents the particular view/icon. For example "MoonView"


2) To add a skycon(For instance, WindView) through Java code, perform following in the activity:

      
        LinearLayout layout = new LinearLayout(this);
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
            LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
        layout.setLayoutParams(params);
    
        //Using these params, you can control view attributes
        //attributres include boolean isStatic,boolean isAnimated, int strokeColor , int backgroundColor
        WindView windView = new WindView(this,true,false, Color.parseColor("#000000"),Color.parseColor("#ffffff"));          
        
        //Using these params, you can control width & height of the icon
        params.width = 200;
        params.height = 200;
        windView.setLayoutParams(params);
      
        layout.addView(windView);
        this.setContentView(layout);
      
      

Customization:

OptionsValueDescription
layout_width100dp (recommended min value)Width of icon
layout_height100dp (recommended min value)Height of the icon
isStaticTrue / FalseBoolean Value to enable on-touch animation
strokeColorHEXCustomize the color of the icon
bgColorHEXCustomize the background colour

<B>Pull Requests</B> are welcomed. We are looking forward for your suggestions on new icons & animations.

##Demo <a href="https://play.google.com/store/apps/details?id=com.thbs.skycons"> <img alt="Get it on Google Play" src="https://developer.android.com/images/brand/en_generic_rgb_wo_60.png" /> </a>

License

Skycons for Android is being made available in public domain under similar terms like the original