Painlessly build and ship apps that conform to the Material design specifications.
The tool is split into two components,
- Keylines - Download and install this Android app first. It renders and controls design specs on the screen.
- SDK - Integrated into the app, sends specifications to the Keylines app for rendering.
1. In your root build.gradle
,
allprojects {
repositories {
maven { url "https://jitpack.io" }
}
}
2. In the build.gradle
of your module,
dependencies {
debugCompile 'com.github.ragunathjawahar.keylines:sdk:(latest-commit-sha)'
releaseCompile 'com.github.ragunathjawahar.keylines:sdk-no-op:(latest-commit-sha)'
testCompile 'com.github.ragunathjawahar.keylines:sdk-no-op:(latest-commit-sha)'
}
3. In your Activity,
The SDK comes with a set of built-in specifications for standard Material design components. You can pick the ones you are interested in. Nothing stops you from writing your own specs if required.
@DesignSpec({ R.raw.spec_list, R.raw.spec_list_item_three_line_avatar, R.raw.spec_fab })
public class EmailsActivity extends AppCompatActivity {
// ...
}
Just add the @DesignSpec
annotation to your Activity
classes.
4. In your Fragment,
@DesignSpec({ R.raw.spec_list, R.raw.spec_list_item_three_line_avatar, R.raw.spec_fab })
public class EmailDetailFragment extends Fragment {
// ...
@Override
public void onStart() {
super.onStart();
Keylines.getInstance().spec(this); // Consider moving this to a base Fragment class.
}
}
That's all. You are all set to build and ship awesome apps conforming to the Material design specifications.
You can write your own specs in JSON and they go into the res/raw
folder. For instance, res/raw/activity_emails.spec
{
"keylines": [
{ "offset": 16, "from": "LEFT" },
{ "offset": 72, "from": "LEFT" },
{ "offset": 16, "from": "RIGHT" },
{ "offset": 16, "from": "BOTTOM" }
],
"spacings": [
{ "offset": 0, "size": 16, "from": "LEFT" },
{ "offset": 56, "size": 16, "from": "LEFT" },
{ "offset": 0, "size": 16, "from": "RIGHT" }
]
}
The tool is based on Lucas Rocha's DSpec library. All units are in DPs. If you want to use a different cell size for the baseline grid, add a baselineGridCellSize
attribute to your spec. For now, this should give an idea about the other keywords that can go into the specification.
Copyright 2014 Lucas Rocha
Modifications 2016 Ragunath Jawahar
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.