Provides a splitter component for Angular Dart
@Component(
selector: 'my-app',
styles: const [
'''
:host {
display: block;
width: 100%;
height: 100%;
}
.container {
width: 50%;
height: 50%;
display: flex;
flex-direction: row;
background-color: black;
}
.panel {
height: 100%;
width: calc((100% - 14px) / 3);
}
'''
],
template: r'''
<div class="container">
<div class="panel first" style="background-color: red;"></div>
<splitter></splitter>
<div class="panel second" style="background-color: blue;"></div>
<splitter></splitter>
<div class="panel third" style="background-color: green;"></div>
</div>
''',
directives: const [materialDirectives, Splitter],
providers: const [materialProviders],
)
class AppComponent {}
More examples:
Parent must use flex layout. The direction of flex layout must be chosen depending on the orientation of the panel layout.
For vertical layout,
.container {
display: flex;
flex-direction: row;
}
For horizontal layout,
.container {
display: flex;
flex-direction: column;
}
Parent must have defined size.
.container {
width: 50%;
height: 100%;
}
Children's tran-section size must fill the parent. Care must be taken that splitter's transaction size is deducted.
Children's cross-section size must fill the parent.
For vertical layout,
.panel {
height: 100%;
width: calc((100% - 14px) / 3);
}
For horizontal layout,
.panel {
width: 100%;
height: calc((100% - 14px) / 3);
}
Splitter
implementationAdd this to your package's pubspec.yaml file:
dependencies:
webide_splitter: "^1.5.5"
You can install packages from the command line:
with pub:
$ pub get
Alternatively, your editor might support pub get
.
Check the docs for your editor to learn more.
Now in your Dart code, you can use:
import 'package:webide_splitter/webide_splitter.dart';
Version | Uploaded | Documentation | Archive |
---|---|---|---|
1.5.5 | Jan 3, 2018 |
|
|
0.0.2 | Oct 8, 2017 |
|
|
0.0.1 | Oct 8, 2017 |
|
|
We analyzed this package on Apr 23, 2018, and provided a score, details, and suggestions below. Analysis was completed with status completed using:
Popularity:
Describes how popular the package is relative to other packages.
[more]
|
43 | / 100 |
Health:
Code health derived from static analysis.
[more]
|
100 | / 100 |
Maintenance:
Reflects how tidy and up-to-date the package is.
[more]
|
100 | / 100 |
Overall score:
Weighted score of the above.
[more]
|
71 |
Detected platforms: web
Primary library:
package:webide_splitter/webide_splitter.dart
with components:html
.
The description is too short.
Add more detail about the package, what it does and what is its target use case. Try to write at least 60 characters.
Maintain an example.
Create a short demo in the
example/
directory to show how to use this package. Common file name patterns include:main.dart
,example.dart
or you could also usewebide_splitter.dart
.
Package | Constraint | Resolved | Available |
---|---|---|---|
Direct dependencies | |||
Dart SDK | >=1.24.0 <2.0.0 | ||
angular | ^4.0.0 | 4.0.0+2 | 5.0.0-alpha+10 |
angular_components | ^0.6.0 | 0.6.0 | 0.8.0 |
dart_to_js_script_rewriter | ^1.0.1 | 1.0.3 | |
Transitive dependencies | |||
analyzer | 0.30.0+4 | 0.31.1 | |
angular_compiler | 0.3.0+1 | 0.4.0-alpha+10 | |
angular_forms | 1.0.0 | 2.0.0-alpha+2 | |
args | 1.4.2 | ||
async | 2.0.6 | ||
barback | 0.15.2+15 | ||
build | 0.11.2 | 0.12.2 | |
build_barback | 0.4.0+2 | 0.5.0+3 | |
charcode | 1.1.1 | ||
cli_util | 0.1.2+1 | ||
code_builder | 1.0.4 | 3.0.3 | |
code_transformers | 0.5.1+4 | ||
collection | 1.14.9 | ||
convert | 2.0.1 | ||
crypto | 2.0.2+1 | ||
csslib | 0.14.1 | ||
dart_style | 1.0.9+1 | 1.0.10 | |
fixnum | 0.10.7 | ||
front_end | 0.1.0-alpha.4.1 | 0.1.0-alpha.11 | |
func | 1.0.0 | ||
glob | 1.1.5 | ||
html | 0.13.3 | ||
intl | 0.15.6 | ||
isolate | 1.1.0 | 2.0.0 | |
js | 0.6.1 | ||
kernel | 0.3.0-alpha.1.1 | 0.3.0-alpha.11 | |
logging | 0.11.3+1 | ||
matcher | 0.12.2 | ||
meta | 1.1.2 | ||
observable | 0.20.4+3 | 0.22.1 | |
package_config | 1.0.3 | ||
path | 1.5.1 | ||
perf_api | 0.1.0 | ||
plugin | 0.2.0+2 | ||
pool | 1.3.4 | ||
quiver | 0.25.0 | 0.29.0+1 | |
quiver_hashcode | 1.0.0 | ||
source_gen | 0.7.5+1 | 0.8.1 | |
source_maps | 0.10.4 | ||
source_span | 1.4.0 | ||
stack_trace | 1.9.2 | ||
string_scanner | 1.0.2 | ||
tuple | 1.0.1 | ||
typed_data | 1.1.5 | ||
utf | 0.9.0+4 | ||
uuid | 0.5.3 | 1.0.0 | |
watcher | 0.9.7+7 | ||
yaml | 2.1.13 | ||
Dev dependencies | |||
angular_test | ^1.0.0 | ||
browser | ^0.10.0 | ||
test | ^0.12.0 |