savvisingh / DateRangePicker

Date Range Picker is a Calendar Picker View to show a Customized Date Range Picker with improved UI and functionality to add subtitles to the dates
Apache License 2.0
784 stars 160 forks source link

Date range color #15

Closed RanchhodRamani closed 5 years ago

RanchhodRamani commented 6 years ago

Can we change the selected date range color. current is yellow tried - android:listSelector="@color/black" but no luck

savvisingh commented 6 years ago

Actually, I am using vector drawable to set selected date range background, so if you want to change the colour of those drawables

RanchhodRamani commented 6 years ago

"Actually, I am using vector drawable to set selected date range background, so if you want to change the colour of those drawables...."

pls complete

savvisingh commented 6 years ago

Sorry for late response, they are state_range_last, state_range_middle, state_range_first in drawable folder

RanchhodRamani commented 6 years ago

Thank you, But inside the CalendarPickerView class. Did not find any usage of that drawables. Can you please help me from where exactly I use this?

On 07-Feb-2018 23:36, "Sarabjeet Singh" notifications@github.com wrote:

Sorry for late response, they are state_range_last, state_range_middle, state_range_first in drawable folder

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/savvisingh/DateRangePicker/issues/15#issuecomment-363857031, or mute the thread https://github.com/notifications/unsubscribe-auth/AMOvPM8QLXKaN6A4EZjv6JsA8-lmIPauks5tSeXvgaJpZM4RxP4f .

savvisingh commented 6 years ago

I have created a State Range Selector named calendar_bg_selector

RanchhodRamani commented 6 years ago

<com.savvi.rangedatepicker.CalendarPickerView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/calendar_view" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_below="@+id/llDateRange" android:paddingLeft="@dimen/_5sdp" android:paddingRight="@dimen/_5sdp" android:paddingBottom="@dimen/_10sdp" android:scrollbarStyle="outsideOverlay" android:clipToPadding="false" app:tsquare_dividerColor="@color/white" app:tsquare_headerTextColor="@color/black"/>

Please add your code in above. i am totally blind. i need custom color for the selected date range, current is yellow

i am using "compile 'com.savvi.datepicker:rangepicker:1.0.1'"

kylin17 commented 6 years ago

Hey @RanchhodRamani , you just need to change the color value in rangedatepicker/src/main/res/drawable/state_selected.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item>
    <shape android:shape="oval">
      <!-- change this color value -->
      <solid android:color="#ffcf40" />
      <stroke android:width="16dp"
          android:color="@android:color/transparent"/>
    </shape>
  </item>
</layer-list>

I suggest set this select color drawable to rangedatepicker's attribute .

daniel-micic commented 6 years ago

@RanchhodRamani you can actually create your own state_selected.xml in your project and it will override the one from this dependency

prasad456 commented 6 years ago

@daniel-micic where should give the selector to date?

daniel-micic commented 6 years ago

in your res/drawable folder, but i ended up copying the whole source code of this repo into my project because i needed to customize it more

prasad456 commented 6 years ago

@daniel-micic i asked where should I mention in the view for which attribute

daniel-micic commented 6 years ago

if you create file state_selected.xml this library will automatically use it and take colors defined in it, you need to poke around the lib to find how exactly to do this, I worked with it over a month ago so unfortunately I don't remember details ...

prasad456 commented 6 years ago

I created the same file but I named other name range_selector.xml, I implemented the library in gradle not added to my project.

daniel-micic commented 6 years ago

not sure, but I think it needs to be named exactly state_selected.xml, otherwise it won't override the one in library

prasad456 commented 6 years ago

@daniel-micic it worked for single selection not for range selection any selector need to add?

daniel-micic commented 6 years ago

oh yes, i remember now, that's why I copied the whole library in my project, to change color for date range I had to change some resources inside it

melanke commented 6 years ago

Maybe, if you use the resource color inside the drawables it will be overridable, like this:

https://stackoverflow.com/questions/37289717/override-resources-in-library-android

Shoaib3008757 commented 6 years ago

it worked for single selection not for range selection any selector need to add?

CoolMind commented 6 years ago

@daniel-micic I tried to replace most of the files in https://github.com/savvisingh/DateRangePicker/tree/master/app/src/main/res/drawable inside app's res/drawable but has no luck. Neither in SelectionMode.RANGE, nor in SelectionMode.SINGLE mode dates could replace yellow with own color.

UPDATE

After many attempts I made it. Downloaded a zip-file and unpacked, changed several files, built, rebuilt, launched an application and understood how to change colors. I think it's better to fork the library and change sources if the author doesn't mind. First try to do the following steps in a new project, and if succeed, do in your own. Follow these 14 simple steps. 😋

1) Download the zip-file of the library. 2) Add to colors.xml your new color of a date range background: <color name="my_color">#00BBFF</color>. 3) Copy from the zip-file a folder rangedatepicker to your app's folder (near ".gradle", "app", "build"). 4) Find your build.gradle in app's folder and add:

android {
    compileSdkVersion 28
    defaultConfig {
        ...
        vectorDrawables.useSupportLibrary = true // Optionally for SVG support.
    }
dependencies {
    ...
    implementation project(':rangedatepicker')
}

5) Remove implementation 'com.savvi.datepicker:rangepicker:1.2.0' if added. 6) In settings.gradle add ':rangedatepicker' (it becomes include ':app', ':rangedatepicker'). 7) Find a build.gradle in rangedatepicker folder and change versions (from 25, 25.0.3) as in your app's build.gradle. 8) Sync build.gradle and optionally press Build > Rebuild Project.

If there are errors, resolve them. For instance, remove all "build" folders inside the project and rebuild it. If you see an error: Unable to resolve dependency for ':app@build/compileClasspath': Could not resolve project 'rangedatepicker', do like in https://stackoverflow.com/questions/46949622/android-studio-3-0-unable-to-resolve-dependency-for-appdexoptions-compileclas: add to build.gradle in rangedatepicker folder lines like in app's build.gradle:

        build {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
        // "release" may continue to retain the same.

9) Copy from the library's drawable folder all files to your app's drawable folder. Watch that they will be copied to drawable, not drawable-v24. 10) Change a color #ffcf40 in all new drawable files to your color @color/my_color. 11) Add to colors.xml of the app's folder all needed colors from the library: lines from <color name="dateTimeRangePickerStateDefault">@android:color/black</color> to <color name="dateTimeRangePickerRangeTextColorInactive">#B9B9B9</color>. 12) Again, change in colors.xml all yellow colors to my_color. 13) Rebuild (probably several times with Build > Rebuild Project) the project and run. Later to check that a color is not yellow, open day_text_color.xml and see what is the color of @color/dateTimeRangePickerStateToday.

That was enough for a simple app, but in a bigger project yellow colors have substituted partially. So, I made the last step.

14) In the library folder remove all state_*.xml files and calendar_text_selector.xml, but retain calendar_bg_selector.xml and day_text_color.xml. Probably optionally you can change colors there, but not remove files.

rodrigof1307 commented 5 years ago

@daniel-micic I tried to replace most of the files in https://github.com/savvisingh/DateRangePicker/tree/master/app/src/main/res/drawable inside app's res/drawable but has no luck. Neither in SelectionMode.RANGE, nor in SelectionMode.SINGLE mode dates could replace yellow with own color.

UPDATE

After many attempts I made it. Downloaded a zip-file and unpacked, changed several files, built, rebuilt, launched an application and understood how to change colors. I think it's better to fork the library and change sources if the author doesn't mind. First try to do the following steps in a new project, and if succeed, do in your own. Follow these 14 simple steps. 😋

  1. Download the zip-file of the library.
  2. Add to colors.xml your new color of a date range background: <color name="my_color">#00BBFF</color>.
  3. Copy from the zip-file a folder rangedatepicker to your app's folder (near ".gradle", "app", "build").
  4. Find your build.gradle in app's folder and add:
android {
    compileSdkVersion 28
    defaultConfig {
        ...
        vectorDrawables.useSupportLibrary = true // Optionally for SVG support.
    }
dependencies {
    ...
    implementation project(':rangedatepicker')
}
  1. Remove implementation 'com.savvi.datepicker:rangepicker:1.2.0' if added.
  2. In settings.gradle add ':rangedatepicker' (it becomes include ':app', ':rangedatepicker').
  3. Find a build.gradle in rangedatepicker folder and change versions (from 25, 25.0.3) as in your app's build.gradle.
  4. Sync build.gradle and optionally press Build > Rebuild Project.

If there are errors, resolve them. For instance, remove all "build" folders inside the project and rebuild it. If you see an error: Unable to resolve dependency for ':app@build/compileClasspath': Could not resolve project 'rangedatepicker', do like in https://stackoverflow.com/questions/46949622/android-studio-3-0-unable-to-resolve-dependency-for-appdexoptions-compileclas: add to build.gradle in rangedatepicker folder lines like in app's build.gradle:

        build {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
        // "release" may continue to retain the same.
  1. Copy from the library's drawable folder all files to your app's drawable folder. Watch that they will be copied to drawable, not drawable-v24.
  2. Change a color #ffcf40 in all new drawable files to your color @color/my_color.
  3. Add to colors.xml of the app's folder all needed colors from the library: lines from <color name="dateTimeRangePickerStateDefault">@android:color/black</color> to <color name="dateTimeRangePickerRangeTextColorInactive">#B9B9B9</color>.
  4. Again, change in colors.xml all yellow colors to my_color.
  5. Rebuild (probably several times with Build > Rebuild Project) the project and run. Later to check that a color is not yellow, open day_text_color.xml and see what is the color of @color/dateTimeRangePickerStateToday.

That was enough for a simple app, but in a bigger project yellow colors have substituted partially. So, I made the last step.

  1. In the library folder remove all state_*.xml files and calendar_text_selector.xml, but retain calendar_bg_selector.xml and day_text_color.xml. Probably optionally you can change colors there, but not remove files.

After following this I am now getting this error "android.content.res.Resources$NotFoundException: File res/drawable/calendar_bg_selector.xml from drawable resource ID #0x7f070065. If the resource you are trying to use is a vector resource, you may be referencing it in an unsupported way. See AppCompatDelegate.setCompatVectorFromResourcesEnabled() for more info."

But I am only getting this error when I test the app on my phone. If I test the app on the emulator it works fine!

Any tips? I have tried to move the file calendar_bg_selector.xml to the app drawable folder but I still get the same error

CoolMind commented 5 years ago

@rodrigof1307, I browsed my app and found calendar_bg_selector.xml in two folders: res/drawable/ (app) and res/drawable/ (rangedatepicker). The files are equal:

<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">
  <item android:drawable="@drawable/state_range_middle" app:tsquare_state_range_middle="true" />
  <item android:drawable="@drawable/state_selected" android:state_selected="true" app:tsquare_state_range_first="false"
        app:tsquare_state_range_last="false" app:tsquare_state_highlighted = "false"/>
  <item android:drawable="@drawable/state_range_first" app:tsquare_state_range_first="true" />
  <item android:drawable="@drawable/state_range_last" app:tsquare_state_range_last="true" />
   <item android:drawable="@drawable/state_unavailable" app:tsquare_state_highlighted = "true"/>
  <item app:tsquare_state_current_month="false">
    <shape android:shape="rectangle">
      <solid android:color="@android:color/transparent" />
    </shape>
  </item>
  <item android:drawable="@android:color/transparent" app:tsquare_state_today="true" app:tsquare_state_unavailable="false" />
  <item android:drawable="@drawable/state_range_middle_unavailable" app:tsquare_state_unavailable="true"  />

</selector>

In the same res/drawable folder (inside app project) I put other dependent files: state_range_middle.xml, calendar_text_selector.xml and so on. If you wish, you can add your project to see.

What is an API version of the device? What is a brand? Do you have a good support of SVG like in https://stackoverflow.com/questions/39419596/resourcesnotfoundexception-file-res-drawable-abc-ic-ab-back-material-xml?

rodrigof1307 commented 5 years ago

@CoolMind Thanks for the response and the help! I tried to copy the files do both the res/drawable folders and I set vectorDrawables.useSupportLibrary to true in both grades ( app and rangedatePicker ) but it wasn't enough. I had to write this line AppCompatDelegate.setCompatVectorFromResourcesEnabled(true); on the activity that uses the dateRangePicker. For future reference, the device's API is 16 and it's a Samsung GT I8730

CoolMind commented 5 years ago

@rodrigof1307, you are welcome! For older devices I usually create MyApplication.kt file and write so:

class MyApplication: Application() {
    override fun onCreate() {
        super.onCreate()
        // For SVG support.
        AppCompatDelegate.setCompatVectorFromResourcesEnabled(true)
        // For Timber library, if you use it.
        Timber.plant(Timber.DebugTree())
    }
}

Then attach it in AndroidManifest:

    <application
        android:name=".MyApplication"
...

In my case vectorDrawables.useSupportLibrary = true was enough to add only in app build.gradle (without rangedatepicker). I didn't catch whether you achieved a result or not.

rodrigof1307 commented 5 years ago

I didn't catch whether you achieved a result or not.

Yeah, the app is working perfectly and I managed to customize the colors. Thanks for all the help!

CoolMind commented 5 years ago

@rodrigof1307, nice to hear it! Good luck!

PavloZoria commented 5 years ago

Hi guys. I have found complete workaround. Drawable resources which are used for range shape are lay in drawable-anydpi-v21 folder. So you need to copy and paste that folder to your project to overwrite contained resources by your own

CoolMind commented 5 years ago

@pavloZorya, hello! It seems to me I tried similar variant, but for drawable folder, and it didn't help due to compile errors. What if you have minSdkVersion < 21?

PavloZoria commented 5 years ago

@pavloZorya, hello! It seems to me I tried similar variant, but for drawable folder, and it didn't help due to compile errors. What if you have minSdkVersion < 21?

Have you tried to override folder "drawable-anydpi"? Please note - without "-v21"

alashow commented 5 years ago

Try this: https://github.com/savvisingh/DateRangePicker/pull/48#issuecomment-468889033

savvisingh commented 5 years ago

Hi Please check the new version of the lib 1.3.0 and you can find the info in ReadMe on how to override the default colors